Як прогресивні веб-програми знову роблять мережу великою завдяки Алану Семенову Medium
Алан Семенов
24 вересня 2017 · 13 хв читання
Прогресивні веб-програми - це одна з найгарячіших тенденцій веб-розробки на даний момент, де все більше людей охоче дізнаються про концепцію та технологію. Більшість статей на цю тему є або дуже низьким рівнем, і їх важко поглинути людям, що не є технічними, або, навпаки, дуже короткими та неглибокими. Ця стаття намагається досягти неможливого - поясніть концепцію PWA таким чином, щоб вона була привабливою та зрозумілою не лише для ІТ-спеціалістів, а й для тих, хто загалом цікавиться новинками та гарячістю веб-індустрії сьогодні.
Бути прогресивним - важко. Ви повинні постійно йти в ногу зі світом, що постійно змінюється, і добре знати про нові тенденції у мистецтві, моді, політиці, здоров’ї та їжі. Ви повинні мати можливість переказати Трампа від Обами. Знайте, що Мане і Моне - це не той самий хлопець, хоча обидва вони малювали речі. Готуйте, як Джеймі Олівер (або принаймні робіть вигляд, що готуєте їжу, хаотично розкидаючи їжу по вашій кухні). Покиньте гамбургери та кебаб на користь зеленого листя невідомого походження, яке навіть корови відмовляються їсти. Пийте коктейлі з тих самих листочків, намагаючись з усіх сил не кидати.
Бути прогресивним в ІТ-бізнесі ще складніше. На додаток до всього, що згадувалося вище, ви повинні мати можливість програмувати у всіх популярних фреймворках JavaScript, мати 50 футболок будь-якого відтінку сірого, розпізнавати кожного покемона по імені та не плутати IPA та APA зі SPA. Відростання бороди дасть вам додаткові бали в прогресивності (подвійні бали, якщо ви дівчина).
Якщо ви не 90-річний фермер з Техасу, то, впевнений, у вас є смартфон. Подивіться - ці кольорові квадратики на головному екрані називаються «рідними програмами». Їх називають «рідними», оскільки вони розроблені власним чином для операційної системи вашого смартфона (будь то iOS або Android або - не дай Бог - Windows Phone).
Якщо ви веб-розробник, то, швидше за все, ви створюєте веб-сайти. Але веб-сайти - це ооо 90-ті роки, сьогодні все стосується додатків. І, будучи прогресивним веб-розробником, ви, очевидно, не можете просто розробляти мобільні програми, ну, ну, мобільні програми - це ооооооооооооооооооооооооооооооооооооооооооооооо, Отже, це було лише питанням часу, коли з’явиться концепція Progressive Web Apps народився.
Розробка мобільних додатків завжди була цією «забороненою сферою», куди деякі з нас, веб-розробників, наважились зайти. Вам довелося б бути хардкорним бекенд-програмістом, який би знав Objective-C, Java або C ++ або, зовсім недавно, такі фреймворки, як Xamarin або Cordova, які дозволяють розробникам орієнтуватися на кілька мобільних платформ з однією кодовою базою. І тоді, звичайно, завжди є проблема зробити свою програму загальнодоступною (якщо ви коли-небудь намагалися розгорнути свою програму в Apple AppStore, тоді ви знаєте, що я маю на увазі) і підтримувати синхронізацію веб-сайту та всіх мобільних версій між собою.
Очевидно, що веб-розробники не були задоволені такою ситуацією. Вони невпинно бурчали з підвалів батьківських будинків, дехто навіть клявся кинути пити колу і їсти чіпси, поки проблема не буде вирішена. Одна безрозсудна душа навіть пообіцяла випрати свою ігрову футболку, але прийшла до тями, поки не було пізно. Тим часом багато розумних розумів усіма силами намагалися усунути дратівливий розрив між розробками Інтернету та мобільних пристроїв, поки нарешті в 2015 році Google не представив свою наступну найкращу ідею після вкладки Інкогніто в Chrome - концепцію прогресивних веб-програм.
Концепція блискуча своєю мужньою простотою. Ви розробляєте веб-сайт, який виглядає та поводиться точно так само, як рідний мобільний додаток, а це означає, що його можна додавати на головний екран смартфона, надсилати push-сповіщення, отримувати доступ до апаратного забезпечення пристрою і - найголовніше - працювати в автономному режимі. Так, ви чули добре - Progressive Web App працює так само гладко в хиткій мережі або взагалі без неї, як при повному доступі до Інтернету.
Але ... але ... як браузер може відкрити веб-сайт, не маючи доступу до нього в Інтернеті, можете запитати? Ну, вірте чи ні, але ваш браузер тепер має безліч цікавих функцій, яких ви ніколи не очікували б лише пару років тому, якщо, звичайно, ви не гордий та відданий користувач Netscape або Internet Explorer 6.
Такі сайти, як whatwebcando.today, можуть аналізувати API вашого браузера та показувати, які функції, доступні на мобільних пристроях, також підтримуються вашим браузером. Спробуйте - я впевнений, ви будете здивовані. Моя поточна версія Chrome (56) підтримує 33 із 36 функцій, а над іншими працюємо. Так, це було на моєму ноутбуці, але мобільні браузери не настільки відстають (особливо на платформі Android).
«Гаразд», ти думаєш, «отже, мій браузер підтримує всі ці функції - чудово. Але у мене на смартфоні стільки програм, якими я користуюся щодня, я не можу просто кинути їх і перейти на веб-програми ». Але ви, мабуть, і тут помиляєтесь.
Дослідження, проведене в 2015 році маркетингом.com, показує дивовижну статистику:
Користувачі мобільних пристроїв проводять на своєму пристрої 80% часу, використовуючи лише три найкращі програми
Це показує, що існує дуже висока ймовірність того, що кумедний додаток, який ви завантажили 5 років тому, щоб намалювати вуса на фотографії своєї свекрухи, з тих пір, швидше за все, не використовувався. Більшість із нас використовує лише декілька програм, таких як Facebook, Instagram, Pinterest, Twitter, програму зчитування пошти, якийсь погодний додаток, і все про це. І - сюрприз! - більшість із них також можуть функціонувати як веб-програми, набагато легші за розміром.
Додаток Facebook у AppStore важить до 300 мегабайт (і це без вмісту!). Але коли я відкрив свою стрічку Facebook у браузері, вона завантажила лише 3 Мб вмісту. Так, різниця в 100 разів.
Ще одним величезним недоліком мобільних додатків є їх відкриваність. Щоб завантажити програму з магазину, перш за все її потрібно знайти там (це означає, що ви повинні точно знати, що шукаєте, інакше доведеться просканувати безліч пропонованих лайна), натисніть «Завантажити», підтвердьте, погодьтеся з умовами, введіть свій пароль, дочекайтеся завантаження програми, дочекайтеся встановлення бла-бла-бла ... До того часу, коли все закінчиться, ви можете легко забути, що саме ви шукали для початку.
За словами Габора Челе, менеджера з продуктів у Google, у мобільному додатку кожен крок, який ви спонукаєте користувача виконати, перш ніж він отримає цінність від вашого додатка, коштуватиме вам 20% користувачів.
Наведена вище діаграма порівнює, скільки часу проходить у користувача від моменту, коли він виявив програму, до моменту, коли її фактично відкриває, в Інтернеті та на мобільному. Різниця становить 40 секунд, і це надзвичайно довгий час в Інтернеті. Краса веб-програми полягає в тому, що її надзвичайно легко знайти, як і звичайний веб-сайт - ви погуглите його, натиснете посилання, щоб відкрити його, і все, у вас є програма на вашому пристрої, готова до запуску.
У це важко повірити, але лише за рік з травня 15 по травень 2016 року кількість завантажень мобільних додатків у США зменшилась більш ніж на 20%.