Прошел ровно год с того момента, как наша команда начала разработку своего первого продукта — ionic-приложения для знакомств, которое является отечественным братом всем известного tinder. В течение этого года мы столкнулись с множеством проблем, характерных для гибридных приложений, теперь у нас есть опыт и замечания, которыми мы были бы рады поделиться с вами.

Почему ionic?


Ionic был выбран потому, что мы — веб-разработчики, а JavaScript в целом и angular в частности — это то, в чем мы действительно хороши. У нас не было времени вникать в детали разработки под ios, затем android, тратить на это ограниченные время и деньги. Нужно было сделать все максимально быстро, потратить наименьшее количество времени, выпустить и проверить, полетит ли приложение. Классические предпосылки для разработки гибридного приложения.

Приведем пару популярных мифов о гибридных приложениях и наш взгляд на них спустя год разработки.

Write once, run everywhere


Факт — 90-95% кода приложения является общим для обеих платформ. Есть особенности платформ, которые иногда нужно учитывать, не все плагины, которые мы использовали, одинаково хорошо работали как на android, так и на ios, но факт остается фактом — чаще всего мы писали один и тот же код, который одинаково работал на большинстве устройств. Однако. Часто на написание кода под определенную платформу уходило времени больше, чем хотелось бы.

Для разработки гибридного приложения не нужно быть mobile-разработчиком


Ни один из членов нашей команды не имел опыта мобильной разработки. В основном мы занимались привычной нам веб-разработкой, использовали уже готовые плагины для нативных возможностей телефонов. Но не все так просто. У использованных нами cordova-плагинов не всегда хватало некоторой «заточенности» и действительно иногда хотелось, а один раз пришлось дописать плагин на Java и Objective-C. Так что опыт мобильной разработки не обязателен, но крайне желателен, особенно если ваше приложение будет сильно зависеть от нативных возможностей устройств.

Гибридные приложения медленнее нативных


Гибридным приложениям не хватает чувства нативности и плавности, с этим не поспоришь. С развитием браузеров и frontend-фреймворков каждый день делается маленький шаг вперед, ionic уже сегодня имеет неплохой набор директив и стилей, чтобы сгладить острые углы. Но вышеупомянутого чувства нативности и плавности все равно не хватает.

Одна из главных проблем, с которой мы столкнулись — поддержка старых версий android 4.x. Браузеры в этих версиях android портили нам жизнь, все работало из рук вон плохо, а многие вещи просто не поддерживались. Нас спас crosswalk, который вместе с приложением подкладывает актуальную версию webview. Crosswalk ускорил работу приложения на старых устройствах в разы, и это правда. Стоит заметить, что данной проблемы не было при работе с ios-устройствами — они оперативно обновляются.

Ionic экономит время и деньги


Ionic хорош для несложного клиента к вашему серверу, который будет удобнее мобильной версии сайта. Ionic также хорош для прототипирования — на нем неплохо опробовать концепт, после чего, убедившись и получив достаточное количество ресурсов, написать нативные приложения для необходимых вам платформ. В этих нишах ionic дейтсвительно хорош и вы вряд ли пожалеете, использовав его. Но если вы решите написать что-нибудь действительно сложное, в особенности приложение, которое зависит от многих нативных возможностей устройств, то в определенный момент вы потратите слишком много и на выходе (что весьма оптимистично) получите некачественный продукт.

Результат


По ряду причин (в основном не зависящих от выбранной технологии) разработка проекта затянулась на год, она не раз приостанавливалась и возобновлялась, а мы потеряли большую часть энтузиазма. В итоге продукт перерос из прототипа (который нам нравился) в полновесное приложение с богатым функционалом (которым мы не до конца довольны). Иногда не хватает плавности, иногда скорости и чего-то еще. Мы выложили его сначала на App Store и Play market, затем подумали и поделились кодом со всеми на github.

Какие мы сделали выводы


Ionic подходит для прототипов и простых клиентских приложений. Использовав его для такого рода приложений вы будете счастливы. Если ваш продукт слишком сложен и сильно зависит от нативных возможностей устройств — забудьте про ionic, так вы спасете себя от лишних затрат и лишней работы.
Поделиться с друзьями
-->

Комментарии (24)


  1. Amareis
    29.05.2016 18:00
    +4

    Несколько капитанская статья… Но это, конечно, куда лучше чем вообще никакой статьи.


  1. autobusiness
    29.05.2016 19:01
    +1

    Подскажите, вы пишете на Ionic 2, или все написанное про первый. Недавно начали знакомиться со вторым, было бы интересно узнать о реальных различиях в скорости.


    1. hrabouski
      30.05.2016 10:12

      Здравствуйте, я писал про первый ionic, со вторым только начинаем знакомство, но уже пишем один проект в продакшн, так что через некоторое время могу написать и про него.


  1. ZoomLS
    29.05.2016 20:47
    +1

    Вы не пробовали Framework7? Что можете сказать про него? Посмотрел доступные подобные фрамеворки, выбор пал на него.
    Ionic, как я понял, больше делает упор на Angular. А Framework7, вроде как, не обязывает использовать что-то определенное.


    1. adasoft
      30.05.2016 09:16

      F7 — можно использовать vanilla js или же интрегрировать Angular, vue.js или как я angular light. Примеры есть на форуме поддержки F7

      Про Crosswalk — это хорошо, хотя и там глюки встречаются, но 24мб за 3 скришнота которые есть в сторе как то слишком…
      И старые андроиды не так страшны, как кажется — куча фиксов css для того, чтобы это выглядело и работало похоже как на 4.4+
      А вот с новыми андроидами возникает интересная вещь — так как WebView обновляется отдельно от андроида, то вообще не возможно предугадать, какой ВебВью стоит у пользователя на устройстве и с какими глюаками. Так же и с iOS — с каждой новой версией узнаешь, то одно перестало работать, то другое. И требует каких то действий разработчика для исправления данной ситуации.

      С другой стороны Ionic радует довольно большим сообществом разработчиков, поддержкой интерфейса под Windows Phone из коробки и довольно большим набором компонентов для построения приложения, ну и Ionic2, может он поможет убрать «тормоза» первой версии (привет ангуляру).


      1. hrabouski
        30.05.2016 10:18

        Про crosswalk — все верно, но не всегда есть время (деньги) на поиск и устранение всех багов, его добавление быстро решает проблему, но, конечно, цена — размер приложения.


    1. hrabouski
      30.05.2016 10:13

      Не использовали Framework7, в команде используем ionic как раз из-за нашего опыта с angular.


  1. Vint-ik
    30.05.2016 09:15

    Вставлю небольшие замечания, если позволите. Crosswalk спасает ситуацию со старыми браузерами, но приложение раздувает непомерно. У нас были такие цифры — билд по андроид, без crosswalk ~ 5 MB, c ним ~ 41 MB. На iOS да, работает все очень шустро и здорово, без crosswalk. Использовали связку Ionic 1 + MeteorJS client + сервер на MeteorJS. В целом выводы сделали точно такие же, как и в статье. Но данная связка позволяет построить рабочий прототип, весьма сложного сервиса, с сервером, приложением под все платформы, да еще и с полной реалтайм синхронизацией всего и вся, за пару недель по вечерам одному человеку.


  1. mr-cpp
    30.05.2016 09:15

    Не упомянули в статье о расходовании памяти на андроид устройствах
    Такая проблема должна была появиться
    Сталкивались? Какие решения применяли?


    1. hrabouski
      30.05.2016 10:19

      Если честно — не сталкивались.


  1. Focushift
    30.05.2016 09:16

    Хотелось бы отдельный рассказ про проблемы с плагинами.


    1. hrabouski
      30.05.2016 10:21

      Проблема с плагином геолокации на андроиде забрала под неделю времени и много нервных клеток, остальные плагины вроде как не доставили нам проблем.


  1. lizarge
    30.05.2016 09:16

    Внешний вид этого приложения лучшая реклама нативной разработки.


    1. Focushift
      30.05.2016 10:00

      Внешний вид, это реклама дизайнера приложения, а не средств разработки.


  1. GameBull
    30.05.2016 09:16

    Сам уже год пишу под Ionic + angular js и полностью согласен с мнением автора. Да, плавности и скорости этому красавцу не хватает. Можно конечно всунуть в проект такие вещи как fastclick, collidejs, отключить js скроллинг, но это не сравнимо с нативной мощью и красотой


  1. vitalets
    30.05.2016 18:21

    А не рассматривали react-native?


    1. hrabouski
      30.05.2016 18:25
      +1

      совсем немного с ним баловались https://github.com/akveo/react-native-reddit-reader


  1. JavaFox
    30.05.2016 18:29

    помню работал с IONIC. Очень не нравилось, но это вина не ionic а вообще cordova-образных платформ. Для меня был минус, что многих функций не хватает. У меня было несколько проблем с ionic. Если есть решение, то просьба написать. Уже давно не работал с ionic но буду знать в будущем
    1) В Android не работал userLandscape режим. Т.е. landscape был только в одном положении. Если перевернуть планшет верх ногами, то картинка не переворачивалась. Решил проблему изменением манифеста после компиляции в андройд проект, перед компиляцией в apk. Выходило геморно. C iOS такого не было.
    2) Не нашёл как спрятать кнопки навигации (если в планшете они программные). Тут признаюсь, наверное плохо искали, но опять же решалось проблема с помощью java кода перед компиляцией в apk.


    1. hrabouski
      30.05.2016 18:30

      Со второй проблемой не сталкивались в связи с тем, что кнопки навигации убирать было не нужно. С landscape не помню, чтобы были какие-либо проблемы.


    1. Focushift
      30.05.2016 19:03

      1)Для управления режимами есть специальный плагин.


  1. to2n
    31.05.2016 12:34

    Не используете привязку верстки к дизайну через vh/vw? Или что делаете когда требуется единообразное отображение интерфейса на экранах с разными разрешениями?
    Просто с первым вариантом столкнулся с громадной проблемой — при открытии клавиатуры vh пересчиывается по оставшейся области над клавиатурой и все элементы интерфейса скукоживаются.
    На андроиде нашел стабильный лайфхак, но вот на ios ни чего не получилось сделать. В какойто момент плюнул и заменил везде использование vh на vw пересчитав через соотношение сторон на fullhd.


    1. adasoft
      02.06.2016 15:43

      забавный глюк… vh/vw не использую, только px и % и всё нормально на всех платформах, за исключением WP8/8.1-первых версий.


  1. Steinmar
    01.06.2016 13:16

    Писали ли вы unit тесты на ваше приложение(может и капитанский вопрос, тогда пардон)?


    1. hrabouski
      01.06.2016 15:02

      нет, формат разработки не предусматривал тесты