Pull to refresh
155.53
Rating
TINKOFF
IT’s Tinkoff — просто о сложном

Как выбрать мобильную кросс-платформу в 2021 году

TINKOFF corporate blogDevelopment of mobile applications
Translation
Original author: Vladimir Ivanov

Кросс-платформенные решения - тренд в мобильной разработке. Уже есть различные технологии от PWA до Flutter и Kotlin Multiplatform. Как выбрать среди них?

Новый развивающийся бизнес зачастую в первую очередь ориентируется на мобильные технологии: социальные сети, необанкинговые решения, приложения для электронной коммерции, такси и другие. Новый бизнес ориентирован на экономическую эффективность, поэтому переход на кросс-платформенность для разработки мобильного приложения кажется правильным выбором. Посмотрим, что будет в 2021 году и как выбрать правильную технологию.

Познакомимся с Женей

Евгения — солюшн-архитектор. Она должна решить, как построить новое мобильное приложение для изучения английского языка не носителями: людьми из Турции, Италии или России. Давайте посмотрим, как Женя подходит к этой задаче.

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

В компании — владельце приложения также ожидают, что разработкой будет заниматься единая команда — как для Android- и iOS-приложений, чтобы свести к минимуму усилия по передаче знаний и максимизировать скорость команды. В будущем также планируют запустить веб-приложения. А еще в компании хотели бы упростить будущий найм.

Прогрессивные веб-приложения

Женя начинает свои исследования. Она гуглит «мобильные веб-приложения» и находит статью. В ней упоминаются «Прогрессивные веб-приложения» (PWA). Что это такое?

Прогрессивные веб-приложения — это, по сути, веб-сайты, которые используют специальные API для доступа к определенным возможностям устройства. Эти API позволяют получить доступ к памяти на устройстве, интегрируются с Push Notifications (на Android) и, что самое важное, работать в отдельной вкладке браузера. Еще их можно установить на устройство «иконкой», как настоящее приложение. Звучит неплохо! Давайте посмотрим на плюсы и минусы PWA:

Плюсы:

  • Всем занимается одна команда.

  • Достаточно навыков веб-разработки.

  • Легко обслуживать.

  • Все работает сразу из коробки.

Минусы:

  • Нет пушей на iOS.

  • Неудобный UX.

  • Ограниченная поддержка.

  • Трудно найти — пользователи скачивают приложение в сторах.

А вот и хорошая табличка, показывающая доступность PWA в разных браузерах:

Гибридные приложения

Жене не нравится, что PWA обладают ограниченной поддержкой пушей. Поэтому она гуглит дальше.

Она обнаруживает гибридный подход: давайте поместим наш сайт в WebView в реальном нативном приложении. Оказывается, можно поместить свой мобильный сайт со всем его HTML, CSS и JS-кодом в ресурсы приложения. Затем вы помещаете WebView в корневой ViewController/Activity приложения и указываете на эти ресурсы.

Пользователи смогут найти приложение в Google Play и AppStore, чего не было в случае с PWA. А еще, если вам нужны дополнительные возможности, вы можете легко добавить их — ведь у вас настоящее приложение, для этого уже есть необходимые фреймворки.

Плюсы:

  • Высокая скорость работы.

  • Настоящая кросс-платформенность.

  • Можно пользоваться практически всеми преимуществами нативных приложений.

Минусы:

  • UX не очень (ведь перед нами по-прежнему сайт в шкуре приложения).

  • Небольшое сообщество разработчиков.

Архитектура гибридного приложения
Архитектура гибридного приложения

Примеры таких приложений: Appcelerator, Ionic, Apache Cordova.

Нативные кросс-платформенные приложения

Большой недостаток гибридных приложений — плохой UX. Поскольку это все еще браузер в мобильном приложении, он подтормаживает.

Евгения все еще пытается получить единую кодовую базу для своего решения, но при этом решить проблему с вялым UX. Поэтому она читает больше про нативные кросс-платформенные фреймворки.

Xamarin

Xamarin — это решение на основе .NET от Microsoft.

Xamarin (или NET 5.0) помогает сделать кросс-платформенное приложение используя C# и .NET в мобильном приложении. Xamarin Forms (или MAUI) — это библиотека для построения пользовательского интерфейса в таких приложениях.

Плюсы:

  • Легко разрабатывать в компаниях с сильной экспертизой в технологиях Microsoft.

  • Полностью кросс-платформенное.

  • Потенциально можно сделать его и веб-приложением.

Минусы:

  • 2 виртуальные машины в приложении на Android - JVM и Mono

  • Мало инструментов и библиотек

  • Долгое время исправления багов в Xamarin

  • Растет размер бандлов

React Native

React Native создан для того, чтобы привнести React в мобильные технологии. И это действительно хорошо сработало! Согласно статистике Bitrise, React Native занимает 13% рынка. Его также используют более 500 тысяч репозиториев на «Гитхабе».

React Native использует языки Javascript или TypeScript для разработки приложений и транслирует компоненты React Native в компоненты платформы. Так, превращается в TextView на Android.

Приложение включает в себя JavaScript VM для выполнения JS-кода логики и пользовательского интерфейса приложения. React Native также умеет работать с API платформы. С такой архитектурой можно создать любое приложение, даже мобильную игру.

Плюсы:

  • Большое сообщество.

  • Пользуются в Skype, Discord, Shopify, Tesla, Artsy.

  • Доступны нативные возможности приложений.

  • Можно писать на React.

Минусы:

  • Долгое время запуска.

  • Экстеншены и работа в фоне требует написания нативного кода.

  • Проходит внутренний редизайн

Flutter

Flutter — это кросс-платформенный фреймворк с открытым исходным кодом от Google, основанный на языке Dart. В отличие от React Native, Flutter использует свой собственный 2D-движок для отрисовки пользовательского интерфейса в нативном виде. Такой подход обеспечивает независимость от версии ОС, на которой работает приложение. Flutter приложение также компилирует Dart в нативный для платформы код в релизной сборке, таким образом в рантайме Dart VM становится не нужна. Советую нашей Жене мое подробное сравнение Flutter и React Native.

Flutter привлек к себе большое внимание, собрал более 100 000 звезд, а количество приложений, собранных с его помощью, продолжает стремительно расти. Согласно той же статистике Bitrise, уже 9% билдов в прошлом году собраны на Flutter. Это очень много для такой молодой технологии.

Плюсы:

  • Хорошая производительность

  • Декларативный UI

  • Поддерживает веб

Минусы:

  • Ненативный UI

  • Малопопулярный язык Dart.

  • Недостаток некоторых инструментов (например, в плане контроля безопасности).

Kotlin Multiplatform

Xamarin, Flutter и React Native позволяют вам написать практически весь код единожды и запускать его и на iOS, и на Android.

Kotlin Multiplatform делает иначе. KMP считает, что пользовательский интерфейс сильно зависит от платформы и самого устройства (скажем, планшета или веб-сайта). Однако бизнес-логика остается практически неизменной. Почему бы не переиспользовать прежде всего ее?

Итак, с KMP у вас все еще есть два нативных приложения, которые пользуются одной бизнес-логикой. Вы можете использовать все, что угодно в пользовательском интерфейсе: будь то родной Android Views, JetPack Compose или Swift UI для iOS. Вы даже можете использовать Flutter или React Native для вашего пользовательского интерфейса! Он все равно будет прекрасно работать с Kotlin Multiplatform. Вот несколько примеров.

Плюсы:

  • Родной язык для разработчиков Android.

  • iOS разработчикам нетрудно читать Kotlin код.

  • Единая среда разработки для Android и iOS.

  • Подходит для реализации веб-приложений.

Минусы:

  • Молодое решение, все еще в альфа-версии.

  • Нельзя переиспользовать UI.

Что же выбрать?

Итак, наша Женя собирается выбрать свое решение. Вот что мы ей посоветуем:

  • Согласна на мобильный сайт вместо приложения, несмотря на ограничения в UI? Тогда — PWA.

  • В компании все пишут на .NET? Значит, Xamarin.

  • Основной стек — это JS/TypeScript? Выбираем React Native.

  • Будем шарить между приложениями не UI, а только бизнес-логику? Значит, Kotlin Multiplatform.

Конечно, это не все критерии: например, мы не рассмотрели доступность разработчиков на рынке или темы поддержки новых версий OS. Но основной алгоритм - выше :)

Удачи, Женя!

Tags:flutterreact-nativexamarinkotlin multiplatform
Hubs: TINKOFF corporate blog Development of mobile applications
Total votes 27: ↑18 and ↓9 +9
Views7.8K
Java/Kotlin разработчик
TINKOFFКраснодарRemote job
Frontend-разработчик (React)
TINKOFFСанкт-ПетербургRemote job
QA engineer
TINKOFFНижний НовгородRemote job

Top of the last 24 hours

Information

Founded
Location
Россия
Website
www.tinkoff.ru
Employees
5,001–10,000 employees
Registered