Кількість активних на сьогодні веб-сайтів становить вражаючі 1,75 мільярда. Значна їх частина це уже не просто сайти-візитки, блоги чи локальні інтернет-магазини, а комплексні додатки, масштаби яких захоплюють. Ще з часів появи Інтернет був одним з передових джерел інновацій внаслідок постійної та стрімкої еволюції технологій розробки, що призвело до глибокої інтеграції веб-аплікацій як у повсякденну, так і у бізнес-сферу. Які ж тенденції визначає 2020-й рік? Ось топ-10 трендів у веб-розробці, котрі, на наш погляд, є актуальними у 2020-му.
Зміни в архітектурі та нові підходи у розробці веб-додатків
Інтернет 90-х сильно відрізнявся від того, яким ми бачимо його сьогодні. Технологічних потужностей було недостатньо аби розробляти складні додатки, які були би здатними витримувати високі навантаження. Тогочасні аплікації були примітивними, а їх функціонал сильно обмежений. Однак, веб-технології достатньо швидко адаптовувались до потреб бізнесу, чим продемонстрували свою гнучкість. Тому можна з впевненістю стверджувати, що з того часу технології веб-розробки змінились до невпізнаваності, залишивши незмінними лише деякі їх основні принципи і продовжують еволюціонувати з року в рік.
Така постійна плинність технологічного стеку призвела до можливості розробляти все більш складні, інноваційні та корисні додатки. Деякі з них настільки сильно інтегрувались у наше повсякденне життя, що ми уже не уявляємо його без їх існування. Тому у 2020-му році спостерігається закономірне продовження вдосконалення технологій веб-розробки.
1. WebAsssembly
Сучасні фреймворки та бібліотеки сильно полегшують життя розробника та допомагають вирішити широкий спектр задач. Водночас вони можуть стати джерелом проблем швидкодії додатку, адже працюють на високому рівні абстракції, а кількість бібліотек та їх залежностей може досягати кількох сотень навіть у відносно нескладних проектах. WebAssembly (або коротко WASM) — це клієнтський бінарний формат, що представляє собою спосіб виконання коду, написаного на різних мовах, зі швидкістю, близькою до нативної.
WebAssembly модулі інтегруються в існуючий Javascript код, комунікуючи з ним за допомогою експортованого назовні інтерфейсу. Використання цієї технології може забезпечити значний приріст швидкодії та відклику веб-додатку. WASM є однією із найбільш передових та молодих веб-технологій, і згодом розробники все частіше використовуватимуть її там, де швидкодія є одним із найважливіших факторів, наприклад, у іграх чи обробці відео-контенту.
2. Модульний підхід, мікросервіси та мікрофронтенд
У 2020-у році розробка веб-аплікацій поступово переходить до використання підходів модульного дизайну та мікросервісів на противагу монолітній архітектурі. Поділ додатків на окремі незалежні частини забезпечує значно вищу гнучкість коду та дозволяє суттєво зменшити його кількість.
Мікросервісний підхід до розробки також передбачає, що команди можуть працювати автономно, розробляючи додаток швидше та концентруючись на окремих компонентах. Своєю чергою, ці компоненти легко поєднуються та взаємодіють між собою, вибудовуючи основний функціонал додатку, що надає широкі можливості для його розширення чи змін.
Презентовані у 2019-му році як “підхід, у якому незалежні фронтенд-додатки складаються у єдину велику систему”, мікрофронтенди продовжують набирати популярність. Цей метод заснований на мікросервісному архітектурному стилі та має багато переваг у випадку, коли є необхідність розділити розробку між багатьма командами, кожна з яких може використовувати різні фреймворки.
3. Постійні зміни у стеку веб-технологій
Однією з найбільших переваг стеку веб-технологій є швидкий темп його розвитку. Постійна поява нових фреймворків та вдосконалення наявних не лише сприяє росту конкуренції між ними, а й дає змогу розробляти все більш комплексні додатки, забезпечує новий досвід і функціонал для кінцевих користувачів та тримає розробників у постійному професійному тонусі. 2020-ий передбачає продовження цієї тенденції.
Зокрема, остання версія фреймворку Angular, 9.1.1, яку випустили в березні 2020-го, ґрунтується на популярному Angular стеку, що додав багато нових підходів до веб-розробки. Один із основних його конкурентів — React.js від компанії Facebook продовжує залишатись лідером на ринку. Близько 20% нових проектів обирають саме його як свій основний тех-стек при розробці фронтенду, а спільнота налічує уже більше 3 млн користувачів та сотні постійно підтримуваних супутніх бібліотек для реалізації широкого спектру задач. Також до топ-3 фронтенд-технолоігй 2020-го року входить Vue.js, що стрімко набув популярності у 2018-у році і успішно поєднує в собі найкращі практики своїх попередників.
Яскравим прикладом швидкої еволюції у сфері веб-розробки є Flutter. Після релізу apha-версії 2017-му та першої стабільної версії у 2019-му він стрімко увірвався на ринок, демонструючи абсолютно нові підходи до створення мобільних додатків та забезпечуючи швидкість відображення аж до 120 кадрів/сек завдяки власно розробленому механізму рендерингу.
4. Односторінкові додатки
Навігація по сучасному веб-додатку з використанням браузерних кнопок назад/вперед, чекаючи перезавантаження сторінки – це те, що сильно бентежить користувачів. Односторінкові веб-додатки усувають ці незручності, зменшуючи кількість перезавантажень сторінки та надсилають дані на сервер у фоновому режимі, чим суттєво змінюють загальне враження від користування продуктом.
З появою у 2005-му році Ajax підходу до побудови користувацьких інтерфейсів, кінцеві продукти докорінно змінились і ця методологія продовжує широко використовуватись і сьогодні, особливо з метою наближення мобільних веб-додатків у своїх функціональних можливостях до нативних мобільних аналогів.
5. Прогресивні веб-додатки (PWA)
Використовуючи передові можливості сучасних браузерів, межа між веб-додатком та нативною аплікацією стає все більш розмитою. Прогресивні веб-додатки (PWA) — це веб-застосунки, побудовані за mobile-first принципом, що імітують функціонал нативної аплікації такий, як: сповіщення, доступ з головного меню мобільного пристрою та оффлайн-режим роботи. Іншими словами, PWA, котрий є гібридом вебсайту і мобільного додатку, дозволяє розробникам трансформувати свою класичну веб-аплікацію у мобільну версію, та розповсюдити її на основних цифрових платформах.
Створення таких додатків дозволяє бізнесу за порівняно менші гроші швидко отримати нових клієнтів, що надають перевагу користуванню мобільним пристроям на противагу десктопу чи ноутбуку. На нашу думку, кількість PWA додатків буде активно зростати у 2020-у році, котрий є продовженням ери мобільних пристроїв.
6. Motion UI
Сучасні додатки часто перевантажені інформацією та функціоналом. Тому задача розробників – зробити користування максимально зрозумілим та інтуїтивним. Motion UI підхід привносить не лише візуальні покращення, але й спрощує процес адаптації для нових користувачів, використовуючи різноманітні анімації та переходи.
Завдяки великій кількості UI бібліотек, імплементація motion UI та інших зручних для користувача технік значно полегшується. На нашу думку, у 2020-у році ми побачимо активний перехід до user-friendly дизайну, котрий буде краще адаптований до користувацьких потреб .
7. Фокус на безпеці
Немає сумнівів, що Інтернет – відкрите середовище, і вразливість даних та хакерство – звичні явища. Цього року розробникам потрібно звернути особливу увагу на заходи безпеки, зосередившись на тестуванні вразливих ділянок та постійному моніторингу веб-додатків, щоб виявити потенційні вторгнення. Один з можливих варіантів рішення цих проблем – постійна присутність брандмауера веб-додатків (WAF).
Ми також вважаємо, що компанії уважніше підбиратимуть інструменти та сторонні послуги. Сукупність ризиків безпеки та проблем з дотримання законодавства підштовхне до впровадження технологій штучного інтелекту для посилення веб-безпеки.
Веб еволюціонує не лише візуально. Серйозних змін зазнає й рівень взаємодії з ним. Якщо донедавна користування веб-сайтом за допомогою голосу видавалось чимось нереальним, то згідно з прогнозами росту ринку розумних пристроїв (динаміків) з 28% у 2018 до 75% у 2020 році, така взаємодія безсумнівно буде чимось буденним та звичним. Ось як зміниться фронтенд веб-додатків уже в 2020 році.
8. Зростання попиту природної мови
Вище ми згадували про голосове керування. Це частина тенденції у розвитку взаємодії між людиною та технологією у більш природній для нас спосіб, що визначається прогресом в галузі обробки природних мов (NLP).
Протягом 2020 року ми очікуємо, що все більше сайтів дозволять використовувати веб-чати, що підтримують NLP, аби мати змогу швидше обробляти щоденні клієнтські запити. Голосовий пошук також стане більш звичним явищем, тому, розробники будуть адаптовувати свої продукти під цей функціонал, що значною мірою розширить ринок смарт-динаміків.
9. Масштабна персоналізація
Сила штучного інтелекту та машинного навчання володіє неймовірним рівнем персоналізації. Зокрема, контекстні рекомендації уже давно існують в інтернет-магазинах, сайтах новин чи відеосервісах. Однак штучний інтелект – це сфера, що швидко розвивається. Коли ми замислюємось про тенденції розвитку веб-додатків, 2020 рік показує потенціал для значного покращення точності цих рекомендацій, і як наслідок, – зростання конверсії.
Готові інструменти роблять штучний інтелект доступнішим для розробників, тому ми передбачаємо, що веб-додатки стануть більш персоналізованими протягом 2020 року. Демократизація штучного інтелекту означає, що навіть невеликі продукти з обмеженим бюджетом тепер зможуть скористатися його перевагами.
Візуальна частина веб-додатків сьогодні — це лише вершина айсберга. Насправді ж Інтернет представляє собою складну інфраструктуру для забезпечення стабільної роботи бекенду веб-додатків та поєднує між собою численні сервіси і специфічні для вебу технології.
Протягом 2020 року ми побачимо все більше змін у представленні веб-інфраструктури на загал — поза межами традиційних веб-сайтів чи браузерних інтерфейсів.
10. Наскрізне розповсюдження Інтернет технологій
Динамічні можливості веб-інфраструктури можуть забезпечувати роботу не лише веб-сайтів. Ми очікуємо, що Інтернет продовжить інтегруватись в наше життя більш тісно у міру розробки нових та креативних способів розповсюдження веб-контенту й на інші платформи за межами звичного браузера.
Для прикладу, розглянемо актуальну сьогодні headless архітектуру, основний принцип якої — відділені бекенд та фронтенд. Цей підхід дозволяє розробникам використовувати свою CMS або eCommerce платформу для створення веб-контенту для будь-якого інтерфейсу чи пристрою, незалежно від того чи мова йде власне про веб-сайт, мобільний додаток або ж інший спосіб реалізації
Автор:
Arsen Slyusarchuk
Javascript Competency Manager в ELEKS