ПОРІВНЯЛЬНИЙ АНАЛІЗ АРХІТЕКТУР ВЕБ-ДОДАТКІВ З ТОЧКИ ЗОРУ ШВИДКОДІЇ ГЕНЕРУВАННЯ ВІДОБРАЖЕННЯ ІНТЕРФЕЙСУ КОРИСТУВАЧА
10.12.2021 21:33
[1. Information systems and technologies]
Author: Чабан С.В., студент, кафедра комп’ютерних систем і мереж, Івано-Франківський національний технічний університет нафти і газу
На даний момент, існує велика кількість архітектур, пов’язаних із розробкою веб додатків, потрібно чітко розуміти кожен підхід та узгоджену термінологію, яку можна використовувати. Відмінності між цими підходами допомагають проілюструвати компроміси відображення веб-додатків через призму продуктивності. Саме тому задача створення методик та підходів до підвищення продуктивності веб-додатків на етапі їх проектування є актуальною. Розглянемо підходи до відображення інтерфейсу користувача, та їх переваги і недоліки.
1. Відображення на стороні сервера (SSR) генерує повноцінну веб-сторінку на стороні сервера коли користувач робить навігацію між веб-сторінками. Це дозволяє уникнути додаткових запитів отримання даних на стороні клієнту, оскільки вони обробляються до того, як браузер отримає відповідь. До переваг такого підходу відноситься швидке початкове відображення та час до взаємодії, найкраща пристосованість до потреб пошукових двигунів та можливість впровадити Incremental Static Regeneration (ISR). До недоліків такого підходу відноситься погане масштабування, відсутність динамічного контенту та недоліки ISR, основним з яких є те, що вміст сторінки не оновляється одразу, а тільки після закінчення терміну дії кешу.
2. Відображення на стороні клієнта (CSR) означає відтворення сторінок безпосередньо у браузері за допомогою JavaScript. Вся логіка, вибірка даних, шаблонування та маршрутизація обробляються на клієнті, а не на сервері.Через такий підхід до візуалізації, розробникам буде складно підтримувати високу швидкість на мобільних пристроях. Можна наблизитись до продуктивності чистого серверного відображення, якщо виконувати мінімум роботи, мати малий обсяг JavaScript коду та доставляти дані з мінімальною круговою затримкою (Round-trip delay). До переваг даного методу відноситься швидке завантаження та навігація по веб-сайту та те, що вся логіка додатку контролюється за допомогою JavaScript на стороні клієнта. До недоліків даного підходу відноситься повільне початкове відображення, складність та проблеми оптимізації роботи зі старими браузерами, та непристосованість сторінок до SEO.
3. Гідратація серверних додатків - це підхід, який часто називають універсальним або просто «SSR», намагається згладити компроміс між відображенням на стороні клієнта та відображенням на стороні сервера, виконуючи обидва. Запити навігації, такі як повне завантаження або перезавантаження сторінки, обробляються сервером, який відтворює веб-додаток в HTML, потім JavaScript і дані, які використовуються для візуалізації, вбудовуються в результуючий документ. До переваг даного методу відносяться швидке початкове відображення, пристосованість до SEO, динамічний вміст, широкий спектр підтримуваних браузерів, а також потокове відображення даних. Однак, для того, щоб JavaScript на стороні клієнта міг точно «підняти» з того місця, де зупинився сервер, без необхідності повторно запитувати всі дані, які сервер використовував для відтворення свого HTML, поточні рішення SSR зазвичай серіалізують відповідь із залежностей даних інтерфейсу користувача в документ як теги сценарію. В результаті, отриманий HTML-документ містить високий рівень дублювання.
Проведений порівняльний аналіз дає змогу вибрати архітектуру додатку, відносно вимог та принципів, які ставляться в основу його роботи, для досягнення відповідних показників продуктивності
Література:
1. Онлайн ресурс Web Dev: веб-сайт. URL: https://web.dev (дата звернення: 25.11.2021).
________________
Науковий керівник: Слабінога М.О., доцент кафедри КСМ ІФНТУНГ