Пример типовой архитектуры веб-приложения | OTUS
⚡ Подписка на курсы OTUS!
Интенсивная прокачка навыков для IT-специалистов!
Подробнее

Курсы

Программирование
Python Developer. Professional
-3%
Разработчик на Spring Framework
-5%
iOS Developer. Professional
-8%
Golang Developer. Professional
-6%
Базы данных
-12%
Agile Project Manager
-5%
Android Developer. Professional
-11%
Microservice Architecture
-5%
C++ Developer. Professional
-5%
Highload Architect
-6%
JavaScript Developer. Basic
-8%
Kotlin Backend Developer
-9%
C# Developer. Professional
-9%
Team Lead
-6%
Алгоритмы и структуры данных Разработчик программных роботов (RPA) на базе UiPath и PIX Unity Game Developer. Basic Разработчик голосовых ассистентов и чат-ботов Vue.js разработчик VOIP инженер NoSQL Супер-практикум по использованию и настройке GIT Symfony Framework iOS Developer. Basic Супер-интенсив «СУБД в высоконагруженных системах» Супер-интенсив "Tarantool"
Инфраструктура
DevOps практики и инструменты
-12%
Базы данных
-12%
Network engineer. Basic
-10%
Network engineer
-4%
Экcпресс-курс «ELK»
-10%
Инфраструктурная платформа на основе Kubernetes
-6%
Administrator Linux.Basic
-10%
Экспресс-курс «CI/CD или Непрерывная поставка с Docker и Kubernetes»
-30%
Дизайн сетей ЦОД
-13%
PostgreSQL
-8%
Разработчик программных роботов (RPA) на базе UiPath и PIX Reverse-Engineering. Professional Внедрение и работа в DevSecOps Administrator Linux. Advanced Infrastructure as a code in Ansible Супер - интенсив по паттернам проектирования Супер - интенсив по Kubernetes Экспресс-курс «IaC Ansible»
Специализации Курсы в разработке Подготовительные курсы
+7 499 938-92-02

Пример типовой архитектуры веб-приложения

Architec_PO_Deep_18.3-5020-6011b1.png

Понимать архитектуру современного веб-проекта и знать концептуальные основы должен любой разработчик или тестировщик ПО. В этой статье мы рассмотрим типовую архитектуру веб-приложения. В первую очередь, давайте рассмотрим диаграмму ниже.

1_K6M_x_6e39jMq_c_2xqZIQ_1-20219-04c3bc.png

Представьте, что вы пользователь и хотите найти в поисковике «сильный и красивый туман, пронизанный солнечными лучами в лесу». Для этого вы заходите в Google и набираете что-то в стиле «Strong Beautiful Fog And Sunbeams In The Forest». И вот, один из первых результатов отправляет вас на Storyblocks. Нажав на ссылку, вы перенаправляете веб-браузер на страницу с картинкой. В это самое время ваш браузер посылает на DNS-сервер запрос, дабы установить соединение со Storyblock, а потом, получив ответ, отправить запрос на сайт.

Запрос поступает на балансировщик нагрузки. Балансировщик выбирает для обработки запроса один из веб-серверов, на которых работает сайт, причём делает это случайным образом. Выбранный веб-сервер извлекает часть информации об интересующей вас картинке из службы кэширования, а остальное он извлекает из основной БД. Если цветовой профиль для интересующего фото ещё не вычислен, соответствующая задача добавится в очередь заданий. Серверы выполняют обработку этих заданий асинхронно, обновляя БД с результатами.

Следующий этап — поиск похожих изображений, для чего в службу полнотекстового поиска поступает запрос с заголовком фото в качестве входных данных. В случае, если пользователь авторизован, информация об учётной записи загружается из БД учётных записей. Далее информация о просмотре веб-страницы поступает в firehose-хранилище для дальнейшей записи в облачное хранилище данных (данные из хранилища аналитики потом используют для обработки).

Потом сервер рендерит HTML-страницу, отправляя её обратно вашему веб-браузеру, но путём прохождения через балансировщик нагрузки. Веб-страница включает в себя CSS- и Javascript-файлы, загруженные в облачное хранилище. Так как хранилище подключено к CDN, веб-браузер связывается с CDN, чтобы получить содержимое. И вот теперь-то, наконец, веб-браузер покажет вам нужную страницу. Естественно, на деле всё происходит довольно быстро.

В целом, именно так выглядит типовая архитектура веба, хотя могут быть и отличия. Если хотите рассмотреть каждый из процессов более детально, прочитайте статью «Web Architecture 101». Её автор, Jonathan Fulton, постарался рассказать всё, что необходимо для понимания архитектуры современного web-проекта.

Не пропустите новые полезные статьи!

Спасибо за подписку!

Мы отправили вам письмо для подтверждения вашего email.
С уважением, OTUS!

Автор
0 комментариев
Для комментирования необходимо авторизоваться
🔥 Только до 28.02
Успейте приобрести курсы февраля на выгодных условиях! Подробности в чате.