Плюси і мінуси розробки додатків на Ionic

Ionic — це технологія, що дозволяє розробляти повноцінні програми для iOS і Android. Для цього не потрібно мати глибокі знання в кожної з платформ. Звичайно ж, є деякі обмеження, але в цілому необхідно бути знайомим з Angular (популярний веб-фреймворк), щоб почати розробку програми. Для застосування стилів можна використовувати SCSS — це додасть додатком потрібний вид. У цій статті розглянемо головні переваги та недоліки Ionic.

У Ionic є вбудована бібліотека стандартних елементів, які можна використовувати аналогічно елементів Bootstrap: картки, кнопки, перемикачі, сегменти, попап, поля введення, списки, сітка з рядків і колонок і т. д. За замовчуванням ці елементи змінюються так, щоб виглядати як нативні на iOS і Android, але їх вигляд можна змінювати при необхідності.

Також з Ionic вам доступно безліч плагінів, які дозволяють використовувати залізо смартфона (Ionic Native/Cordova). Але не забудьте простежити, щоб ваші платформи активно підтримували вибрані плагіни. У більшості випадків такі плагіни працюють добре, але іноді може виникнути помилка білду або конфлікт навіть з широко використовуваними плагінами начебто входу через Facebook або Firebase Analytics. Такі проблеми зазвичай вирішуються чищенням і ребилдом проекту, або оновленням плагіна (за умови, що вже є його нова версія, яка вирішує проблему). Також можна замінити плагін на альтернативний або в деяких випадках — додати параметри, що дозволяють перезаписувати в config/xml/.

Кілька заміток про наш досвід з певними Ionic Native/Cordova модулями:

Для належної роботи деяких плагінів потрібно тонка настройка, наприклад глибинних посилань — модуль легко підключити, але складно змусити працювати як слід.
Для роботи входу через Facebook в консолі Facebook для розробників знадобиться додати base64, використаний для підпису вашого додатка.
«Поділитися на Facebook» відкриває повідомлення, але його не можна заздалегідь заповнити потрібним текстом. Однак можна показати користувачеві підказку про те, що текст або посилання можна вставити. При цьому важливо використовувати тільки валідні HTML-посилання.
Також ми використовували наступні плагіни без великих труднощів: Поділитися на Twitter, Копіювати в буфер обміну, Вибрати зображення з галереї/використовувати камеру, Обрізати зображення, Блокування повороту екрану, Браузер в додатку, виклик редактора email, а також Локалізацію/Глобалізацію.

У Ionic є ще один великий плюс — швидкість розробки. Оскільки він заснований на Angular, проект на Ionic можна запускати в браузері і бачити, як буде виглядати додаток під час розробки. Для того, щоб побачити таке превью, не обов'язково встановлювати програму на смартфон або емулятор. Це істотно допомагає економити час при зміні UI. А коли ви працюєте над функціями, що вимагають перевірки на смартфоні (наприклад, зробити фото), збірка білду і установка його на смартфон займе всього кілька хвилин. На Android встановлювати програми можна прямо з командного рядка, а на iOS білд потрібно відкрити в Xcode.

Гібридні vs рідні додатки

Нещодавно з'явилося кілька фреймворків, що дозволяють розробляти справжні рідні додатки з використанням Angular (NativeScript) або React (React Native). Вони мають важливу перевагу перед гібридним підходом Ionic — ніщо не може зрівнятися з продуктивністю рідних додатків. Однак рідні додатки мають не менш важливий мінус. Використовуючи Ionic, ви працюєте з HTML і SCSS-файлами, а для нативної розробки вам знадобляться інші навички для роботи з розміткою і стилями. Цих навичок немає у більшості веб-розробників.

Деплой в Google Play Store

Щоб випустити завершене додаток, вам знадобиться його спочатку зібрати:
ionic cordova build android --prod --release. Потім його потрібно підписати за допомогою jarsigner(інструмент для підпису АПК), використовуючи свій JKS-ключ і zipalign (інструмент для перетворення підписаної програми в АПК в готовий для завантаження на Google Play Store). При цьому важливо використовувати той же JKS-ключ, який завантажений в вашу консоль розробника Play Store.

iOS

Виходячи з нашого досвіду, Ionic для iOS не настільки налагоджений, як для Android. Ми стикалися з дивною поведінкою такого елемента розмітки, як сегмент — іноді він може конфліктувати зі скролінгом. Також багато елементи вимагають окремих SCSS - стилів для того, щоб вони виглядали як вам треба на обох платформах. Те ж відноситься до плагіну Flurry Analytics. Його легко встановити і використовувати Android, а на iOS цей плагін не встановлювався простими способами і зажадав використовувати CocoaPods — пакетний менеджер для установки плагінів на iOS. І навіть після правильної установки цей плагін не ініціалізується так само, як на Android.

Інший плагін, який перетворює зображення в base64, видає злегка відрізняється формат base64 на Android і iOS. Але в цілому більшість плагінів повинні працювати, хоча деякі вимагають тонкої настройки.

Плюси

Швидка розробка і мінімальний час виходу на ринок.
Можна вести основну частину розробки в браузері (крім нативної функціональності смартфона — тут знадобиться використовувати смартфон для дебага).
Можна розробляти додаток для iOS і Android одночасно (з деякими обмеженнями, такими як особливості платформ, що стосуються стилів і плагінів).
Навички в Angular, HTML, CSS і JavaScript — це практично все, що потрібно для початку розробки. Немає необхідності знати Java і Swift або Objective-C.
Безліч UI-компоненти доступні і прості у використанні — картки, кнопки, перемикачі, сегменти, попап, поля введення, списки, сітка з рядків і колонок і т. д.
Безліч плагінів , що дозволяють використовувати функції смартфонів, такі як: камера, сканер відбитків пальців, NFC, геолокація, відправка аналітики на Firebase, оповіщення і глибинні посилання.

Мінуси

Нативні плагіни можуть стати проблемою, якщо якісь з використовуваних плагінів конфліктують або якщо в одному з них баг. Наприклад, нещодавно в плагіні для логіну за допомогою Facebook був баг: якщо юзер хоч раз зробив log out, то більше логін вже не працював. А плагін FCM (Firebase Cloud Messaging) не працює з firebase analytics. Але є плагін під назвою Firebase, яким можна замінити їх обидва. Дебаг може бути досить складним: іноді важко зрозуміти, звідки приходить помилка, оскільки повідомлення про помилки можуть бути неінформативними.

Білд може ламатися без причин, що виявляється пошкодженим в оригінальній папці. Так що робіть коміти часто і використовуйте гілки для кожної нової функції або сторінки. Якщо щось зламається, просто зробіть клон репозиторію у новій папці, запустіть npm install і спробуйте зібрати проект заново.

Висновок

Ionic — відмінна технологія, що дозволяє зробити готове для випуску додаток набагато швидше, ніж при традиційній розробці. Великий плюс цього підходу — те, що замість Java/Swift/Objective-C можна використовувати стандартні технології веб-розробки, такі як HTML, CSS, JavaScript/TypeScript і Angular. Є невеликий мінус в продуктивності — нативне додаток може бути більш чуйним на старих пристроях, але на будь-якому сучасному смартфоні різниця буде незначною.

Опубліковано: 12/10/18 @ 07:06
Розділ Різне

SEO Блог