Запровадження
Цифрова трансформація з кожним роком охоплює все більше різних сфер життя та бізнесу. Якщо бізнес хоче бути конкурентоспроможним звичайних інформаційних сайтів вже недостатньо, необхідні мобільні та веб-додатки, які не просто дають користувачам інформацію, а й дозволяють виконувати якісь функції: отримувати чи замовляти товари та послуги, надавати інструменти.
Так, наприклад, сучасним банкам вже недостатньо мати сайт з інформацією, необхідно мати онлайн-інструменти для своїх клієнтів, особистий кабінет, де користувач може керувати рахунками, інвестиціями, кредитами. Навіть малому бізнесу, для підвищення конверсії, необхідні зручні інструменти, наприклад запис на прийом до лікаря або перукарню, бронювання столика в ресторані або дитячої кімнати для проведення дня народження.
А самим власникам потрібно своєчасно отримувати інформацію у зручному вигляді за станом своєї компанії, наприклад, збір статистичних даних та аналітики з різних відділів виробництв, або продуктивність відділів. Часто кожен з відділів, по-своєму збирає ці дані, і навіть можуть використовувати різні інструменти і власнику потрібно витрачати багато особистого часу, щоб розібратися у всьому цьому, побічно чи прямо це може впливати на ефективність компанії та, зрештою, на прибуток. Тут також допоможе цифрова трансформація та розробка веб-або мобільного додатка.
Технології не стоять на місці і постійно розвиваються, і те, що використовували кілька років тому, вже може бути неактуально сьогодні, або те, що не могли зробити кілька років тому, вже стало реальністю. Існує більше кількість сучасних інструментів, які допомагають створювати веб-і мобільні додатки швидше та якісніше. Грунтуючись на особистих спостереженнях і досвіді, хочу поділитися своїм баченням, які технології та інструменти будуть затребувані найближчим часом і чому на них варто звернути увагу при створенні сучасного веб-додатку.
Single page application (односторінкові програми)
Давайте трохи визначимося із термінологією. Single Page Application (SPA) – це веб-додаток, компоненти якого завантажуються один раз на одній сторінці, а контент підвантажується за потребою. І при переході між розділами програми сторінка не перезавантажується повністю, а лише підвантажується та відображаються необхідні дані.
Односторінкові програми сильно виграють за швидкістю роботи та зручністю використання у класичних web-додатків. За допомогою SPA можна досягти ефекту роботи веб-сайту, як програми на робочий стіл, без перезавантажень і суттєвих затримок.
Якщо кілька років тому односторінкові програми практично не підтримували пошукову оптимізацію та їх використовували переважно для створення особистих кабінетів та панелі адміністрування, то сьогодні створити односторінкову програму з повною підтримкою пошукової оптимізації (SEO) стало набагато простіше. Використовуючи односторінкові програми із серверним рендерингом сьогодні ця проблема повністю зникла. Іншими словами, це така ж односторінкова програма, але при першому запиті, сервер генерує не просто дані, а створює готову для відображення HTML сторінку і пошукові системи отримують готові сторінки з усією мета-інформацією та семантичною розміткою.
З розвитком з розвитком інструментів створення клієнтських веб-додатків, розробка та перехід на односторінкові програми в цьому та наступних роках будуть тільки зростати. Якщо у вас старий додаток, який морально застарів і працює повільно, та ще з повним перезавантаженням сторінки при переході між розділами, то цього року можете сміливо оновлюватися на швидку односторінкову програму – зараз гарний час, технології вже дозволяють це зробити досить швидко та якісно.
Мати сучасний та швидкий веб-сайт це дуже добре, але хочу чесно вам повідомити: не всі програми можна легко перевести в односторінкові, і перехід може коштувати недешево! Тому треба розуміти, кому і навіщо потрібний такий перехід.
Щоб допомогти вам розібратися, у таблиці нижче я наведу кілька прикладів, коли розробка або перехід на SPA доречні та обґрунтовані, а коли ні.
ЗА
Якщо ви хочете зробити сучасний, швидкий додаток і хочете, щоб користувалися не лише веб-версією, а й мобільною або навіть десктопною, а всі процеси та обчислення відбувалися на віддаленому або хмарному сервері. Та ще й так, щоб усі клієнти мали один інтерфейс взаємодії і не було необхідності вносити кожну правку до серверного коду при додаванні нового клієнта.
Наприклад: соціальна мережа, агрегатори, SaaS платформи (програмне забезпечення як хмарна послуга), маркетплейси
Якщо у вас є магазин або веб-сервіс, ви знаєте, що він повільний і люди йдуть, хочете зробити швидшим, розумієте цінність клієнтів і готові заплатити за апгрейд від мільйона рублів.
У вас є мобільна програма, яка використовує API сайту, а сайт при цьому повільний і з повними перезавантаженням контенту при переході між сторінками
ПРОТИ
Якщо ваша цільова аудиторія не використовує сучасні браузери та девайси.
Наприклад: специфічні корпоративні сфери, такі як розробка внутрішніх систем для банків, медичних установ та освіти.
Основну діяльність ви ведете в онлайн і не готові надавати будь-які послуги онлайн, і вам потрібно просто залучити клієнтів.
Якщо у вас є інтернет-магазин або веб-сервіс, який і так добре продає, ви не бачите відтоку клієнтів та скарг
Якщо у вас є робоча програма, яку неможливо адаптувати під SPA і потрібно просто все переписувати з нуля та використовувати інші технології, а ви не готові витратити на це кілька мільйонів.
Наприклад: Є коробковий сайт або якийсь самописний древній монолітний код.
Прогресивні веб-програми
Progressive Web applications (прогресивний веб-додаток) – це продукт спільної еволюції нативної програми та веб-сайту. По суті, це веб-додаток, який виглядає і веде себе як реальний нативний додаток, може отримувати пуш повідомлення, працювати в офлайн-режимі і т.д. При цьому користувачеві не потрібно завантажувати програму з AppStore або Google Play, а достатньо просто зберегти на робочий стіл.
Як технологія чи підхід до розробки PWA розвивається з 2015 року, а останнім часом ще й набирає величезної популярності в e-commerce сфері.
Декілька реальних прикладів з життя:
- торік готель Best Western River North після того, як запустив новий сайт із підтримкою PWA, зміг збільшити виторг на 300%;
- арабська Авіто OpenSooq.com після створення підтримки PWA на своєму сайті змогла збільшити на 25% час відвідування сайту та на 260% кількість лідів;
- відомий сервіс для знайомств Tinder зміг зменшити швидкість завантаження з 11.91с до 4.69с розробивши PWA, більше того, додаток важить на 90% менше від свого нативного Android аналога.
Про те, що варто звернути увагу на цю технологію, говорить і те, що один з найбільших движків для створення e-commerce проектів Magento в 2018 році запустив ранню девелоперську версію PWA Studio. Платформа дозволяє «з коробки» створювати фронтенд на базі React для своїх e-commerce рішень із підтримкою PWA.
Порада для тих, хто вже має інтернет-проект або тільки ідею нового сервісу з підтримкою мобільних пристроїв: не поспішайте писати повноцінний нативний додаток, а спочатку подивіться на технологію PWA. Можливо це буде найкраще рішення щодо співвідношення ціни та якості для вашого продукту.
Трохи із практики. Щоб створити простий нативний мобільний додаток новин за умови, що вже є готовий REST сервер, необхідно приблизно 200-300 людино-годин на кожну платформу. При середній ціні ринку за годину розробки в 1500-2000 руб./час, додаток може коштувати близько 1 мільйона рублів. Якщо розробляти веб-додаток із повною підтримкою PWA: push повідомленнями, офлайн режимом та іншим плюшками, то розробка займе 200-300 людино-годин, але продукт відразу буде доступний на всіх платформах. Тобто економія приблизно вдвічі, не кажучи вже про те, що не доведеться сплачувати внесків для розміщення в магазинах додатків.
Без сервера
Це ще один сучасний підхід до розробки. Через назви багато хто думає, що це дійсно безсерверна розробка, писати back-end код не потрібно, а будь-який фронтенд розробник зможе зробити повноцінний веб-додаток. Але це не так!
При створенні Serverless-додатку сервер, як і раніше, потрібен і бази даних теж. Основна відмінність цього підходу в тому, що back-end код представлений у вигляді хмарних функцій (інша назва serverless - FaaS, функції як сервіс або Functions-as-a-Service) і дозволяє програмі швидко та легко масштабуватись. При створенні такої програми розробник може сфокусуватися на бізнес-завданнях і не думати про масштабування та налаштування інфраструктури, що згодом прискорює розробку програми та знижує її вартість. Більше того, Serverless підхід допоможе заощадити на оренді серверів, оскільки він використовує рівно стільки ресурсів, скільки потрібно для виконання завдання, і якщо немає навантаження, то серверний час взагалі не використовується і не оплачується.
Наприклад, велика Американська медійна компанія Bustle змогла зменшити витрати на хостинг більш ніж на 60% при переході на Serverless. А компанія Coca-cola при розробці автоматизованої системи продажу напоїв через автомати змогла зменшити витрати на хостинг з $13000 до $4500 на рік за рахунок переходу на Serverless.
Останні пару років через новизну та свої обмеження Serverless в основному використовувався для невеликих проектів, стартапів та MVP, але сьогодні, завдяки еволюції програмного забезпечення, універсальності та потужності контейнеризації серверів, з'являються інструменти, які дозволяють прибрати обмеження, спростити та прискорити розробку хмарних додатків .
Це означає, що корпоративні бізнес-сценарії, в яких хмарна модернізація раніше вважалася неможливою (наприклад, для периферійних пристроїв, даних або додатків із збереженням стану), тепер є реальністю. Хорошими інструментами, що подають великі надії, є kNative та Serverless enterprise.
Але при цьому, Serverless не є срібною кулею для розробки веб-додатків. Як і будь-яка інша технологія вона має свої переваги та недоліки, і потрібно з розумінням вибирати цей інструмент, а «не забивати цвяхи мікроскопом», тільки тому, що він технологічніший.
Щоб допомогти вам розібратися, ось кілька прикладів, коли варто задуматися про Serverless при розробці нового або вдосконаленні поточного веб-сервісу:
- Коли навантаження на сервер має періодичний характер і ви платите за прості потужності. Наприклад, у нас був клієнт із мережею кавових автоматів і необхідно було обробляти запити та збирати статистику лише кілька сотень або тисяч разів на день, а вночі кількість запитів падала до кількох десятків. В даному випадку набагато ефективніше платити тільки за реальне використання ресурсів, тому ми запропонували та реалізували рішення на Serverless;
- Якщо ви не плануєте занурюватися в технічні деталі інфраструктури та переплачувати за налаштування та підтримку серверів та балансувальників. Наприклад, при розробці маркетплейсу ви точно не знаєте яка буде відвідуваність чи навпаки – плануєте велику відвідуваність і щоб ваш додаток напевно витримав навантаження, то Serverless – відмінний вибір.
- Якщо потрібно виконувати якісь потокові події у роботі основного додатка, записувати побічні дані у таблиці, виконувати якісь обчислення. Наприклад, збирати аналітичні дані дій користувача, обробляти їх належним чином та зберігати в базі даних;
- Якщо потрібно спростити, уніфікувати чи прискорити поточну роботу програми. Наприклад, створити покращуючу продуктивність сервіси по роботі із зображеннями або відео, коли користувач завантажує відео, у хмару, і транскодинг займається окрема функція, основний сервер при цьому продовжує працювати в штатному режимі.
Якщо потрібно обробляти події зі сторонніх сервісів. Наприклад, обробляти відповіді від платіжних систем, або перенаправляти дані користувача в CRM для прискорення обробки запитів потенційних клієнтів
Якщо у вас велика програма та деякі частини програми можуть бути реалізовані більш оптимально, використовуючи мову, яка відрізняється від основної. Наприклад, у вас проект на Java і потрібно додати новий функціонал, а вільних рук немає, або цією мовою реалізація може зайняти більший час і є вже рішення іншою мовою, то Serverless може допомогти і в цій.
Це далеко не весь перелік інструментів і технологій, які заслуговують на увагу, я лише поділився тим, що ми використовуємо кожен день у роботі і точно знаємо, як вони можуть допомогти бізнесу.
Джерело: habr.com