Автор оригинала: FreeCodeCamp Community Member.
Хосе Берардо Куна
Родной, веб, PWA, гибридный, скомпилированный … Что такое «лучший» способ разрабатываться на платформы Android и iOS? Что выглядит разумно? И как вы должны выбрать среди вариантов? В этой статье я возложу все это, чтобы вы могли сделать обоснованное решение.
Первые вещи сначала позвольте мне предоставить вам немного контекста. Я являюсь старшим консультантом, и идея выдвижения этого руководства родилась от дискуссий с одним из наших клиентов о том, что может быть лучшим подходом для них. Да, просто для них. И мы поняли, что у нас не было четко определенной стратегии, твердого и надежного фундамента, чтобы помочь нам придумать правильный ответ.
И знаешь, что? Я не смог найти такой гид легко в любом месте в Интернете. Хотя существует несколько статей об этой теме, никто из тех, кто мне не вошел, были достаточно полными. К сожалению, большинство упускают много концепций или, даже хуже, по сути не так.
Теперь я хотел бы взять более широкий вид. И пока я потенциально помогаю кому-то принимать собственные решения, я также прошу община для большего количества мыслей по этому вопросу.
Это руководство имеет две части:
- Архитектурные ярусы мобильного развития (это)
- Как сделать ваше решение
Это также доступно на YouTube как серия из 10 видео и как Бесплатный курс по Udemy Отказ Там вы найдете один и тот же письменный материал, так как здесь, одни и те же видео из серии YouTube, а также викторины, чтобы исправить все темы и окончательную сертификацию.
Так что давайте начнем.
Вступление
Когда дело доходит до мобильных платформ, Срочно, что есть только два больших игрока : Android и iOS. Другие технологии, такие как Tizen, BlackBerry, или Windows Phone, либо умерли, либо находились на некоторое время, и не имеют перспектив достижения любой значительной доли рынка.
Быстрый взгляд на эту массивную дуополию может заставить вас думать, что разработчики не имеют много вариантов при создании мобильных приложений. Эта идея не может быть дальше от правды, хотя. Вы можете быстро заметить причурные языки программирования, используемые там: C/C ++, Java, Kotlin, Objective-C, Swift, JavaScript, Teamscript, C #, Dart, Ruby, и я почти уверен, что я пропустил несколько более.
То же самое относится и к каркасам мобильной разработки. Если вы не являетесь разработчиком, или как-то не знал о новых технологиях за последние 10 лет, вы, вероятно, слышали о Cordova/Phonegap, реагировать на родных, Xamarin, Ionic, Nationscript или трепетание, просто чтобы назвать несколько перекрестных Решения платформы для мобильных приложений.
Итак, давайте посмотрим на все эти кусочки архитектуры и немного сломайте вещи.
TL; доктор
Там нет четкого победителя. Все подходы имеют плюсы и минусы, и могут быть либо наилучшим образом, либо худшим подходящим для вашего следующего проекта. В этом руководстве я классифицирую много разных решений на различные ярусы в зависимости от расстояния, их архитектуры находятся нативной платформе.
Нативные приложения
Начать, давайте пойдем прямо к металлу. Наш первый архитектурный уровень – это родные приложения.
Это уровень, в котором вы должны знать о уединенных характеристиках каждой платформы. Это не мое намерение копать в них, я просто хочу упомянуть несколько вещей в небольшом контексте.
Иос
Начало на стороне iOS, только потому, что это проще, есть только Apple, управляющий миром. Первоначально разработчики, необходимые для изучения объектов-C, запатентованной объектно-ориентированной вариации C с некоторым вдохновением от SmallTalk ( и безумно долгосметочного API ).
В 2014 году Apple объявила SWIFT, мульти-парадигм, который был намного проще, чем его предшественник. Еще можно иметь возможность справиться с наследием объекта-C, но Swift достигла высоких уровней зрелости. Итак, если вы планируете узнать, как втаконно развиваться для iOS, SWIFT определенно, где вы должны начать.
Андроид
На стороне Android существует ряд различных производителей. Подавляющее большинство из них полагаются на процессоры ARM Отказ Но вообще говоря, Android-приложения лежали на экземплярах виртуальных машин ( экземпляры искусства ), чтобы помочь справиться с потенциальными подрядными особенностями ( не без разных удивительных хитростей ).
Вот почему, изначально, язык выбора был Java. Это был не только самый популярный язык в мире в течение почти двух десятилетий ( с несколькими положениями свопащими с помощью C ), но это также известно для своей виртуальной машины Java (JVM). Это уполномочило разработчикам, чтобы скомпилировать свой код до промежуточного базового кода, который можно прочитать и управлять JVM.
С Android на нативной разработке Kit (NDK) также возможно разработать критические части приложения непосредственно в нативном коде, написание в C/C ++. В этом случае вы должны знать о базовой платформе.
Котлин – это язык, представленный Jetbrains в 2011 году. Когда это сначала вышло, несмотря на его гибкость и кратко, это было не более чем еще один язык JVM с более успешными конкурентами, такими как Scala, Clojure, или Groovy. Однако после его первого главного выпуска в 2016 году он быстро начал выделяться из толпы, особенно после того, как Google объявил, что он будет официально поддерживаться на платформе Android на Google I/O 2017 Отказ
Kotlin становится первым классовым языком Google (в настоящее время Kotlin и Java – в этом порядке используются по всей официальной документации Android. Общая замена Java ожидается еще больше, чем теперь, чтобы федеральный апелляционный суд США правил на Бесконечный иск Подано Oracle обвинять Google о нарушении авторских авторских прав Java.
Родные компоненты
Разработка в этом уровне, вы также можете использовать все собственные API и, в частности, родные компоненты. Это сохраняет ваше приложение от того, чтобы восстановить колесо.
Я опубликовал видео демонстрацию того, как создать простой проект на XCode (iOS) и Android Studio. Если вы хотите проверить это:
Основные приложения Преимущества
- Лучшая производительность и верхняя взаимодействие пользователя
- Кровотечение кромки родных особенностей
- Примечательно хорошие IDes Android Studio/Xcode
- Современные языки высокого уровня Kotlin/Swift
- Очень низкоуровневый подход с NDK
Нативные приложения недостатки
- Два кодовых база для обслуживания
- Требуется установка (кроме Android мгновенных приложений)
- Трудно анализировать SEO
- Очень дороже, чтобы пользователи загрузить приложение
Веб-приложения
На другой стороне спектра у нас есть веб-приложения. Веб-приложения по существу приложения работают браузером. Вы не пишете код, ориентированный на платформу, а скорее любой браузер, работающий поверх него.
В этом уровне вы найдете безумное количество претендентов, прыгающих на горло друг друга. Но все они используют арсенал, состоящий из того же оружия: HTML, CSS и JavaScript.
Веб-каркасы и библиотеки, даже при использовании предварительных компиляторов CSS, таких как Меньше или Сасс Даже JavaScript предварительно скомпилированные языки, такие как Tymdercript , CoffeeScript или Поток даже симбиоз как Jsx. или Elm , оставляя один инструменты, как Бабел Используется для транпилирования всего на JavaScript с различными настраиваемыми уровнями соответствия с Ecmascript ежегодно спецификациями (ES6/ES7/ES8 или если вы предпочитаете ES2015/ES2016/ES2017/ES2018).
В конце дня все они представляют собой HTML, CSS и JavaScript и запустить браузер. Нет прямого доступа к собственным API, таких как камера, вибрация, состояние батареи или файловая система, но некоторые из них могут быть достигнуты через веб-API:
Большая проблема с Web API – это их уровень зрелости. Многие из них не поддерживаются некоторыми браузерами. Есть различия в реализациях, особенно через мобильные браузеры.
Преимущества веб-приложения
- Общий код между платформами и настольными браузерами
- Не требуйте предыдущих установок, просто навигайтесь и используйте
- Тонны каркасов и библиотек, чтобы пойти с ними
- Лучше всего для SEO
Недостатки веб-приложения
- Нижняя производительность
- Трудно получить собственный пользовательский опыт
- Требуют подключения к интернету
- Не доступно в официальных магазинах приложений
- API не так зрелый и надежный, как нативные API
Рамки и веб-компоненты
Угловой С Реагировать и Vue Вероятно, самые популярные веб-каркасы по состоянию на 2018 год. Однако быть точным, реагированием считается просто библиотекой из-за ее гибкой и меньшей самоуверенной природы. Угловая, с другой стороны, является сильно самоуверенной структурой. Vue живет в какой-то момент между ними.
Угловая, первоначально называемая Angularjs. был подарен в мир в 2010 году Google. Он быстро начал сиять из-за своей инверсии парадигм по сравнению с другими библиотеками с того времени (например, jQuery , самый популярный потом). Вместо непосредственно разговаривать с элементами HTML для манипулирования состоянием интерфейса UI, с Angularjs, шаблоны были волшебными обновленными всякий раз, когда была обновлена модель JavaScript.
Поскольку Angularjs стал все более популярным, он также вырос цели. Он превратился в полную и самоуверенную структуру, которая была одним из первых, которые серьезно взяли SPA (приложения для одиночных страниц). Этот рост (в обоих аспектах) был ответственен за некоторые API Bloat и проблемы с производительностью.
Реагирование было создано Facebook, чтобы решить свои собственные потребности на презентационном слое. Он ввел много аспектов, которые внезапно стали очень популярными, как виртуальный DOM, односторонний поток данных (первоначально названный Flux , особенно популярен через библиотеку реализации redux ), а смесь HTML и JavaScript называется Jsx. .
Только в 2016 году после долгих дебатов и неожиданных больших изменений Google запустила версию двух популярных веб-структур. Они назвали это угловым, а не ангулярными. Но, как многие люди уже называли первой версией «угловой» (без суффикса «JS»), люди начали звонить в новую версию угловой 2. Это превратилось в проблему именования, так как Google также объявила, что это выпустит новые основные версии каждые 6 месяцев.
На мой взгляд, это была ошибка мамонтов. Я видел это раньше (с Struts vs Struts 2/WebWork, например). У них есть масштабно популярный продукт, который, кажется, достиг своего плато, и он начал быть более подверженным критике, чем похвалы. Если Google решает восстановить его от нуля, они никогда не должны, ни в каких отношениях, просто измените свою основную версию. Как люди доверяют, чтобы они не повторили его каждую новую основную версию Release? Версия для версии предполагается представить изменения об изменениях, но это не значит, что это может быть полностью обновлено.
Угловой это впечатляющий веб-каркас, и я действительно чувствую себя увлеченным этим. Тем не менее, это совершенно новый зверь. У него нет много общего с Angularjs. Даже Vue, которая является еще одной удивительной структурой (вероятно, один из самых приятных для работы, кстати) выглядит больше похоже на Angularjs с видом на птичку. Я считаю, что это вызвало значительное движение от угловых и существенно способствовало по существу реагировать популярность.
Vue – единственная из трех самых популярных веб-каркасов, которые не поддерживаются крупной компанией. На самом деле он был начат бывшим разработчиком Google. Из-за его грозной простоты и крошечного следа, она привлекла внимание от массивного и энтузиазма.
Хотя есть более полные решения, все они работают над вершиной концепции веб-компоненты Отказ Там есть открытая спецификация о них в настоящее время в W3C, а некоторые интересные реализации, такие как Полимер , Трафарет и X-Tag Отказ
В третьем видео серии я не трачу слишком много времени, обсуждающих каркасы, но обсудим библиотеки веб-компонентов:
Мобильные приложения vs Веб-приложения
Я не уверен, что вы заметили, но порядок ярусов я представляю здесь, следует тому, что я думаю, это самый простой путь для изучения всех подходов. Я начал с родного уровня, самым искренне мобильным развитием. Тогда я решил долететь прямо к другой крайне, чтобы представить веб-уровень, который является уровнем, который был доступен с первых смартфонов.
Только сейчас После разработки по сравнению между двумя краями моей диаграммы, я начну рассказать о многих кроссплатформенных подходах для создания мобильных приложений.
Есть долгие дебаты между мобильными приложениями VS Web Apps. Все, что я говорю о мобильных приложениях, не является исключительным для родного уровня. Это также применимо ко всем кроссплатформенным уровням, которые я представляю позже.
Дилемма поведения пользователя
Согласно Comscore Survey в 2017 году , верность пользователя для мобильного приложения является способнее, чем для мобильных сайтов. Согласно Выровненная статья на Forbes Обычно это из-за удобства (например, кнопки домашнего экрана, виджеты, верхние уведомления), скорость (например, более гладкие интерфейсы, почти мгновенные запуска) и сохраненные настройки (например, автономное содержимое).
С другой стороны, в одних и тех же данных ComScore мы узнаем, что клиенты могут быть достигнуты легче с мобильных сайтов, так как они не столько привязаны к их нескольким приложениям предпочтений. Если вы сравните самые популярные веб-сайты по сравнению с наиболее загруженными приложениями, предполагается, что в среднем в среднем 8,9 млн. Уникальных веб-посетителей в месяц доступа к лучшим веб-сайтам. Это почти в три раза больше, чем средние уникальные пользователи лучших 1000 наиболее загруженных приложений.
Это все о распространении против взаимодействия. Ваше веб-приложение имеет более высокий шанс доступов, так как пользователи с большей вероятностью пробуют новые вещи при навигации через их мобильные браузеры. Но мобильные приложения были доказаны более привлекательными и привлекать внимание пользователей на гораздо более длительные периоды.
Теперь, когда вы понимаете дилемму, давайте посмотрим на прогрессивные веб-приложения. Это подход, который настолько привязан к веб-приложениям, которые я классифицирую его как просто приложение к веб-приложениям. Но это большой нарушитель и серьезный кандидат для самых выдающихся новых и прохладных вещей в веб-разработке Интернета и мобильной связи.
Прогрессивные веб-приложения
Прогрессивные веб-приложения (PWAS) – это набор инструментов, используемых для предоставления пользователей веб-приложений, одинаковый опыт, который они привыкли, когда они запускают мобильные приложения. Это означает, что веб-приложения могут использовать потенциально более высокие уровни распределения с более приличными уровнями участия.
Google определил три основных квалификации PWA: они должны быть Надежный, быстрый и привлекательный Отказ
Особенности под названием Сервисные работники и Приложение Shell являются основой прогрессивных веб-приложений. Они были созданы для продвижения надежности приложений, поскольку они теперь предназначены для работы независимо от состояния подключения устройства. Это включает в себя автономный режим, а также плохие соединения. Они также обеспечивают значительное воспринимаемое повышение производительности, поскольку запуск приложений, используя локально кэшированные данные, которые исключает задержки для загрузки синхронного контента.
Вы могли бы рассмотреть надежность косвенного вектора взаимодействия. Пользователи не затрагиваются при работе на поезде, например. Они могут оставаться вовлеченными.
То же самое относится к скорости. Согласно Google:
Однако быть исключительно надежным и быстрым на нагрузке не обязательно гарантирует высокое вовлечение. PWA Leavel Friendbile, связанные с мобильными, которые использовались для эксклюзивных для мобильных приложений, таких как опция «Добавить в главный экран» и Push-уведомления.
Когда дело доходит до функции «Добавить в главный экран», вы можете заметить, что Apple имела аналогичную функцию с самого первого iPhone. Некоторые люди даже утверждают, что прогрессивные веб-приложения являются модным новым именем Google для оригинальной идеи Apple .
И вы действительно не можете полностью не согласиться. Некоторые идеи на самом деле велосипедные. Они приходят, уходят, а затем возвращаются с новым именем и некоторыми улучшениями (например, обслуживающие работники), поэтому они могут наконец-то придерживаться.
С другой стороны, трудно полностью согласиться. Речь Стива Джобса о Web 2.0 + Ajax и запоминающееся объявление о iPhone обратно в WWDC 2007 не достаточно убедительно, чтобы позвонить ему в качестве отца или даже пророка, из PWA.
Чтобы быть справедливым, Add to home screens на iPhone было не более чем тонким, почти скрытым, функцией генерировать значки настольных компьютеров, которые просто запускают веб-приложения в полноэкранном режиме. Он имеет все бремя циклов ответа HTTP-запроса и нет четкого пути вокруг кэшей.
PWA начинается с правой точки. Они изучают, как предыдущие установки веб-приложений не нужны, не теряя загрузочный клиентский загрузчик мобильных приложений. Это означает, что все пользователи для их первого взаимодействия после запуска могут быть локально кэшированы (чтение: приложение Shell) и остается доступным, как только они попали в «Добавить на главный экран».
Переходя на другую известную характеристику PWA, давайте поговорим о Super Invaging (или Re-Placing) функции мобильных приложений мира: push-уведомления. Это сообщения о предупреждении, которые появляются в верхнем баре/области уведомлений, а также на экранах блокировки. У них есть сила вытягивает пользователей обратно в ваше приложение, как только они получат уведомление.
Чтобы укрепить апелляцию PWA, Google потянул все современные веб-API под зонтиком PWA. Поэтому ожидайте увидеть такие вещи, как запросы на оплату, управление учетными датчиками, WEBVR, датчики, WebAssembly и Webrtc в контексте прогрессивных веб-приложений. Но эти особенности не обязательно привязаны к PWA, а некоторые даже родились до того, как был придуман термин PWA.
PWA и яблоко
Apple, с другой стороны, объявила свои первые прочные вехи в направлении PWA только в марте 2018 года. Хотя все еще есть некоторые ограничения, прогресс заметно Отказ Некоторые ограничения могут быть связаны с тем, что сафари упал за его конкурентами. Другие могут быть связаны с философией Apple плотно контроля.
Тем не менее, Apple имеет более прибыльный магазин приложений, чем Google Отказ Утверждает Apple, что больше критериев в публикациях приложений приносит более общую надежность, а PWA приведет к повреждению доходов App Store. Это говорит о том, что некоторые ограничения, которые, по-видимому, намеренно навязаны (например, 50 МБ максимального размера кэша PWA) будут стоить более отзыв.
К сожалению, PWA не идеальны
Веб-решения и, на разных уровнях, все кроссплатформенные решения борются за достижение превосходства и полномочия нативных приложений. Каждая новая функция, и каждая деталь, особенная для Android или iOS делает, что родные чувствуют себя сложнее и сложнее доступа к вашему удалению вашего приложения из родного уровня.
В целом, PWAS исправляет некоторые проблемы в Web Apps Tier. Но есть и другие проблемы, которые не могут быть зафиксированы решением, работающим над браузером.
Какое исправление PWA
- Больше «родного» опыта
- Быстрое время загрузки
- Не требуйте подключения к Интернету
- Заставить веб-разработчиков знать о ситуациях, когда нет связи, а также Плохое соединение
- Включите функции от мобильных приложений, таких как Push-уведомления, геолокация или распознавание речи
То, что они этого не
- Присущая медлительность
- Не доступно в магазинах приложений (только еще)
- До сих пор не полностью поддерживается всеми браузерами
- Все еще не хватает мобильных функций, таких как NFC, окружающий свет, Geofencing
- Также не хватает поддержки особенностей Android или iOS, как PIP, Smart App Banners, виджеты экрана запуска и 3D Touch
На видео ниже я делаю краткий обзор PWA.
Гибридные приложения
На этом уровне мы начинаем погружаться в Mobile App World. Мы начнем с самых далеких ярусов: гибридных приложений.
Термин гибрид также обычно применяется для всех кроссплатформенных решений. Однако здесь я ограничиваю его приложениями, которые работают внутри мобильных компонентов, называемых WebViews.
В демонстрациях во втором видео, моя цель добавления WebView в качестве примера Hello World, заключалась в том, чтобы понять, что для каждой платформы есть нативный компонент для каждой платформы, который может выполнять как настоящий браузер.
Cordova/phonegap.
Такие решения, как Cordova / Phonegap Закройте пробел (извините за неиспользуемый каламбур) между веб-сайтами и мобильными приложениями. Они предоставляют инструменты для пакета HTML, JavaScript и CSS-код разработчика (а также любые дополнительные активы, такие как изображения или видео) и преобразуют их в мобильные приложения (да, реальные приложения Android или iOS). Эти приложения имеют свой веб-просмотр исключительно для интерпретации и выполнения исходного веб-кода, начиная с файла «index.html» в основной папке приложения (обычно называемой «WWW»). Они также переводят код JavaScript на собственные API с помощью плагинов, которые частично реализованы в JavaScript и частично на родном языке.
Итак, давайте сделаем вещи яснее. Гибридные приложения могут получить доступ к собственным API (вместо Web API), но они прилагаются WebView. Кнопка с CORDOVA должна быть кнопки HTML, отображаемой веб-просмотром вместо мобильной подножной кнопки.
Это волшебный уровень, который позволяет компаниям портировать свои веб-приложения в мобильные приложения, которые будут отправлены в магазинах приложений. Таким образом, любая веб-структура допускается здесь.
Ионическое
Фрезы, как Ionic Оберните корверов в свои решения. С помощью Ionic вам не нужно использовать интерфейс командной строки Cordova (CLI), потому что все его команды обернуты ионическими CLI.
Недавно ионная команда решила принять поводья всего стека гибридных приложений. Итак, они запустили предложенную замену для Кордовы под названием Конденсатор Отказ Конденсатор имеет поддержку плагинов Cordova, а также можно использовать неионный проект.
Вы можете наблюдать за мной, проходя через Cordova Hello World World World в пятом видео серии:
Hybrid Apps Преимущества
- Они по существу, веб-приложениями, которые являются отклоняющимися официальными магазинами приложений
- Может использоваться вместе с любым JavaScript Framework/библиотекой
- Код все еще очень распространен через платформы
- Доступ к нативными функциями (например, камера, акселерометр, список контактов)
Гибридные приложения Недостатки
- Борьба с проблемами производительности и потреблением памяти, поскольку веб-представления несут ответственность за рендеринг все на экране
- Приходится подражать все местные компоненты интерфейса на вершине одного вида веб-вида
- Труднее быть принятым и опубликованным в App Store
- Обычно занимают больше времени, чтобы иметь родные функции, доступные для этих условий
Web Nature.
Web Native является относительно новым и часто неправильно понятым уровнем. Вот где веб-приложения соответствуют родным компонентам. Хотя Titanium Appcelerator (Asway) был в течение длительного времени, существуют некоторые относительно новые конкуренты, которые оправдывают эту полностью отдельную категорию мобильных приложений.
Как вы можете видеть выше, нет представления веб-вида для рендеринга и запуска вашего приложения. Итак, как ваш JavaScript выполнен? Это составлено? Что ж, если вы рассматриваете транспиляцию (компиляция с одного языка к другому – например, Typeycript на JavaScript), объединение, зачисление, обучение и запутывание все вместе в качестве компиляции, да JavaScript скомпилируется.
Но проблема в том, что это не делает ваш JavaScript что-то непосредственно с помощью операционных систем Android или iOS. И, в теории, нет родного компонента, который служит только двигателем JavaScript без раздува двигателя макета HTML.
Стратегия заключается в доставке двигателей JavaScript (обычно V8 для Android и JavaScriptCore Для iOS) вместе с вашим кодом. Хотя у них есть небольшие следы и очень быстрые, они являются чем-то внешним, которые должны быть предоставлены вашим приложением.
С другой стороны, этот подход имеет тенденцию иметь лучшую производительность пользовательского интерфейса, так как все компоненты одинаковы (или основаны на той же вещи для реагирования на родом, например), как те, которые используются нативными приложениями.
Web Native Apps Преимущества
- Достичь обеих платформ с одной одной кодовой базой
- Примерно такая же производительность, как и нативные приложения, поскольку они также имеют дело с родными компонентами пользовательского интерфейса
- Твики необходимы, но код все еще совпадает с веб-разработкой
Web Native Apps Недостатки
- Даже с одной одной кодовой базой разработчик должен знать о натуральных компонентах
- Крутая кривая обучения, чем гибридные/веб-приложения для веб-разработчиков, особенно когда дело доходит до макета
Реагировать на родной
В части 6 серии я делаю быстрый Hello World в реактивном родном. Это показывает, на макете макета Android студии, какие компоненты были отображены в эмуляторе. Я сравниваю с предыдущими примерами, гарантируя, что нет WebView Whatsoe.
NativeScript
Еще одна удивительная структура, которую мне особенно заинтересованы в течение последних двух лет ( У меня курс по поводу удемии об этом – на португальском языке), это NativeScript . Это похоже на реагировать на родных, но не привязан к миру на реагирование ( Есть неофициальная интеграция, Nationscript-PreaCt, хотя и ).
С NativeScript вы можете разрабатывать использование ванильного JavaScript, Tymdercript, угловых и, совсем недавно, Vue. Конечно, вы можете использовать другие рамки, но те, которые являются официально поддерживаемыми. Кстати, это довольно хорошо документировано.
На NativeScript есть такие инструменты, как Tainscript Sidekick и Playground Playground , а также конструкции проекта на основе Шаблоны Это может быть предоставлено сообществом. Это должно помочь вам в создании проекта, предоставляя вам возможность запуска, развертывания, тестирования и запустить на симуляторах на облачных и iPhone устройств, даже если вы не разрабатываете использование MAC.
В седьмой части серии я делаю Hello World, используя Sidekick вместе с другим проектом, начатым с CLI и A Шаблон клона WhatsApp Я создал для учебных целей.
Важно посмотреть на инспектор макета, когда ваше приложение работает на эмуляторе Android. С NativeScript он показывает нативные компоненты (опять же, нет WebView), а прямые экземпляры обычных классов Android, как TextView. Это отличается от реакции на родице, у которых есть собственные классы для обертывания нативных компонентов.
Вероятно, поэтому NativeScript утверждает, что нет никакой задержки между тем, когда новая функция доступна на iOS и Android, и когда вы можете использовать его в проекте NativeScript. Например, Они размещены в своем блоге Проект AR в тот же день IOS 11 был официально выпущен с новой ARKIT API.
Weex.
Еще одна структура, которую стоит упомянуть в этой категории Weex. . Это проект, разработанный Alibaba, и в настоящее время инкубирует на основе Software Apache Software (ASF). Он использует Common HTML-теги, такие как Nide & LT; СТИЛЬ> Метки вместо этого называют родные компоненты. Из их документации:
Крест Скомпилирован
На этом уровне пришло время выпрыгнуть с веб-группы. Это самый близкий уровень нативного развития, но имеет преимущество использования одной одной кодовой базы для целевого Android и iOS.
Рубимор и ксамарин
Есть решения, такие как Rubymotion Отказ Это способ написать мобильные приложения, используя Ruby и компилировать непосредственно на целевую платформу (как это было создано с помощью любого «родного» языка).
Другой вариант – Xamarin , где вы пишете в C #, компилируйте промежуточный байт-код и разверните свое приложение вместе с экземпляром Моно общеязыковая среда выполнения. Этот подход имеет тот же недостаток, что и Web Native (где V8 и JavaScriptcore доставляются вашим приложением), но также могут полагаться на Compilations JIT для оптимизации приложения во время выполнения.
Трепетание
Последнее, но не менее важное, я бы хотел поднять Флаттер Отказ Это новейшая прохладная инициатива Google для мобильного развития. Он подходит в кросс скомпилированном уровне, потому что вы пишете приложения, используя Дартский язык и составьте их до родной платформы.
Трепетание носило в некоторых аспектах. Вероятно, самый выдающийся – это тот факт, что он обеспечивает свой собственный набор компонентов.
Какие? Собственный набор компонентов?
Да, трепетание предоставляет ряд различных компонентов, чтобы вы могли полностью пропустить из платформы. Он имеет общие компоненты, а также Материал дизайн Компоненты для Android и Cupertino Компоненты для iOS.
А не .NET виртуальная машина (как ксамарин) или двигатели JavaScript (как нативные рамки для веб), с трепетом вашего приложения доставит компоненты, которые вы решаете использовать.
Они родные компоненты?
Да, они. Ваше приложение тоже родное. Все скомпилировано для родной архитектуры. Однако имейте в виду, что они не являются ранее существующими местными компонентами.
Какой смысл этого?
Ну, на мой взгляд, это решение умное и дерзко. Я ждал, чтобы говорить о преимуществах и недостатках, но, как только одна конкретная технология, позвольте мне решить их сейчас.
Одной из самых больших проблем для веб-нативных и перекрестных скомпилированных решений (помните, над народным, но ниже WebView в наших уровнях) – это то, как иметь дело с родными компонентами. Например, важная проблема в том, как выложить их. Это потому, что они не были созданы для использования этих внешних ресурсов. Кроме того, они не были созданы с аналогом в другой платформе. Например, Android Navbar не работает как iOS Uinavbar, например.
С трепетанием компоненты создаются с помощью кроссплатформы всегда в виду. Итак, давайте посмотрим на плюсы и минусы Cross Compabled Apps Tier:
Крест скомпилированные приложения. Преимущества
- Достичь обеих платформ с одним языком
- Примерно такая же производительность, как и нативные приложения, поскольку они также имеют дело с родными компонентами пользовательского интерфейса
Крест скомпилированные приложения Недостатки
- Слегка задержка поддержки для последних обновлений платформы
- Код не совпадает с веб-разработкой
- Даже с одной одной кодовой базой разработчик должен знать о натуральных компонентах
PS: с трепетом вы предоставите свой собственный набор виджетов вместе с кодом вашего приложения
Архитектура Runtime приложений для мобильных приложений
Как видите, перекрестные скомпилированные решения могут быть распространены на трех из четырех различных квадрантов. В верхнем левом углу вы найдете родные и перекрестные скомпилированные (например, Rubymotion), где ваше приложение (в зеленый) скомпилирован на местные двоичные файлы. Он переговаривает непосредственно к форматам OEM (виджеты производителя оригинального оборудования – то, что мы называем родными компонентами), а также нативным API.
Вершинный квадрант является эксклюзивным для гибридных приложений. Ваше приложение обязательно является HTML/CSS/JavaScript, выполненный на родном WebView (так как мы сделали в пятом видео серии). Cordova/Phonegap или конденсатор может предоставить мосту, чтобы позволить вашему коду JavaScript поговорить с собственными API.
Нижний левый квадрант – это то, где все веб-местные решения, а также Xamarin, вписывается в. Ваше приложение не скомпилировано на нативный код (а скорее двоичный поток в Xamarin), и он управляет переводчиком, чтобы выступить в качестве моста ко всему на платформе.
Наконец, в правом нижнем углу я мог бы сказать, что перекресток скомпилирован, но кажется, что он очень особенный, чтобы трепетать. Это отличается от других кросс-скомпилированных стратегий, которые кажутся более традиционными. В этом случае нет моста, но нет контакта с виджетами OEM (по крайней мере, нет необходимости в этом).
Обратите внимание, что веб-приложения (даже включая PWA) не находятся на графике, потому что они вообще не касаются нативной среды.
В части 8 серии я обсуждаю Cross Compabled Apps и сосредоточиться на трепетании с помощью проекта Hello World.
Обертывание
Подводя итог, я надеюсь, что вам ясно, что здесь нет большого победителя. Нелегко определить идиосинкразии и точки общего для общей классификации. Мое намерение было не представлять долю рынка каждой стратегии или попытаться найти наиболее продуктивного, приятного или надежного способа построить мобильные приложения.
Мое намерение было представлять обзор игроков, и подходы, которые они принимают, поэтому вы можете выбрать то, что лучше всего подходит для ваших потребностей.
Несколько советов, которые помогут вам найти свой путь
Пожалуйста, позвольте мне немного более мстить на данный момент и поднять некоторые вопросы и ответы, которые, надеюсь, проложили свой путь.
Прежде чем мы пойдем вперед, угадайте, что? Точно! Я собрал еще одно видео, охватывающее то, что я собираюсь сказать:
1. Нужно ли мое приложение интенсивные процессы CPU?
Если ответ – Да : Нативные приложения. Помните: Чем ниже вы получаете, тем больше исполнителю ваше приложение имеет тенденцию быть.
Приложения, которые нуждаются в силовой мощности интенсивных вычислений, например, машинное обучение (даже просто работает предварительно обученные модели), являются хорошими кандидатами для родного уровня (или, по крайней мере, Cross Complets).
Если вы думаете о играх, вы могли бы услышать о игровых двигателях Unreal и Unity. Это путь, чтобы пойти на многие игровые компании, и я чувствую, что они вроде в форме в кресте скомпилированным слоем. Я решил оставить их от этого списка только потому, что начинаю беспокоиться о продолжительности этого поста.:)
2. Моя команда достаточно большая, чтобы поддерживать две кодовые базы?
Если ответ – нет : Все, кроме нативных приложений. ПОМНИТЕ: Чем выше вы получаете, тем больше абстрактных и независимых платформы.
Это самая большая вещь, которая тянет людей при рассмотрении родных приложений. Вообще говоря, два кодовых база делают вещи дорого и трудно развиваться. Теоретически, вы не хотите иметь приложение с значительно большим количеством функций на Android, чем iOS, или на вице-версии.
Если оба пункта 1 и 2 имеют отношение к вашему приложению, вы должны назначать, какой из них имеет решающее значение. Или, опять же, рассмотрите среднюю почву с помощью креста скомпилированным подходом.
3. Что моя команда делает лучше всего?
Если ответ – C # : Xamarin. Если ответ – Java : Родной (Android). Если ответ – Веб/JavaScript : От сети на сеть родных.
Кажется очевидно, но, поверьте мне, я видел случаи, когда люди берут это как должное. За исключением случаев, когда Apple придумала Objective-C, выбрасывая ставку STEVE SPAT на PWA-подобный PWA подход для приложений на iPhone, все решения построены с учетом предыдущих способностей разработчиков.
4. Откуда приходят мои пользователи?
Если ответ – Неизвестно (или любой другой, чем магазины приложений): прогрессивные веб-приложения. Помните: при необходимости установить приложения из магазинов приложений, это вызывает дополнительное трение.
Мы обсудили Power Web Distribution над мобильными приложениями в целом (каждый уровень ниже браузера).
Смесь подходов
Веб-технологии позволяют вам иметь смешанную кодовую базу и нацеливаться не только мобильные платформы, но и настольные компьютеры. Я знаю, как такие решения Электрон Чтобы легко развернуть приложение к компьютерам Windows, Mac или Linux. Но я говорю о создании веб-приложения (или даже лучше PWA) Code Code с мобильным приложением.
Хорошо, вы можете поделиться, что Cordova это довольно прилично. Ну, я согласен. Гибридные приложения – это веб-приложения, работающие на веб-просмотре, но я все еще пытаюсь убедить вас, чтобы вы думать из коробки. Что, если вы хотите, чтобы веб-приложение, с шаблонами HTML, которые разделяют код с веб-нативным приложением?
В зависимости от того, какой архитектурный узор, который вы используете для структурирования вашего приложения, все могут быть облегчены путем повторного использования бизнес-логики и множества кода Boverplate, таких как маршрутизация и управление государством. Вам просто нужно определить два набора шаблонов, один для веб, другой для мобильного.
Есть некоторые семена проекта, чтобы помочь вам начать. Например, с Угловое среднее семя Вы начинаете угловой проект, готов к развертыванию на мобильных устройствах. Это может быть так же просто, как создание шаблона файла с разными расширениями:
Extension | Platform------------------------------ | --------------------------.{html/scss} | Recommended for Web.tns.{html/scss} | Only for mobile.tns.ios.{html/scss} | Only for iOS.tns.android.{html/scss} | Only for Android.tns.ios.phone.{html/scss} | Only for iOS Phone .tns.android.phone.{html/scss} | Only for Android PhoneПросто украсим свой угловой компонент с templateurl И правильный файл шаблона будет забран в соответствии с которыми работает платформа.
На фрагменте выше, My-Component.Android.html будет автоматически подхвачен при работе на Android.
Иногда вещи не мертвы просто. Есть шанс, что у вас может быть совершенно отдельный компонент только для одной конкретной платформы. Но имеющие это управление вашим приложением в одной кодовой базе не должно быть целой сделкой.
Посмотреть здесь И посмотрите, как достичь чего-то похожего с React (Web) и реагировать на родных.
Это приводит к другому вопросу. Когда вы должны идти гибрид, и когда вы должны пойти на сеть родных?
Мои 10 центов на это это: если производительность и собственный пользовательский опыт – это то, что вы стремитесь, просто пройдите Web Native. С другой стороны, если сохранение макета в соответствии со всеми целями – это большое значение, и управление двумя или несколькими наборами шаблонов и стилей звучит ошеломляющие, просто идут гибрид.
Как вы можете видеть, когда дело доходит до мобильного развития, любой из этих подходов может работать для вас. Пока поставщики или сопровождающие поддерживают свои продукты, есть веская причина попробовать каждый из упомянутых в этом исследовании.
Я надеюсь, что это было полезно и что вам понравилось это путешествие по многим различным решениям и стратегиям мобильных разработок.
Что дальше?
Возможно, вы заметили, что я не добавил последнее видео серии. Хорошо, там мы идем:
Это все о помощи вам решить Какова лучшая мобильная технология для изучения в 2018 году. Если вы спрашиваете, каковы лучшие технологии, чтобы забрать для вашего следующего проекта, то я бы сказал это зависит. Я не просто хочу сказать “Что бы ни. Просто выберите. Желаю вам всего наилучшего “ . Я хотел бы предоставить вам путь к более эффективному процессу обучения, поэтому вы можете быстро освоить более одной технологии. Так что проверить это последнее видео.
Есть конвергенция, происходящее через мобильные платформы, и языки становится все более и более похожим. Посмотрите это последнее видео, даже если вы не кодируете. Я представляю много функций из Kotlin, Swift и Teadercript. В конце концов, я просто хочу, чтобы вы поняли, что они не разные. Поверьте мне. Посмотрите на видео и дайте мне знать в разделе комментариев. Я действительно с нетерпением жду ваших мыслей на этом.
Спасибо за чтение!
Оригинал: “https://www.freecodecamp.org/news/a-deeply-detailed-but-never-definitive-guide-to-mobile-development-architecture-6b01ce3b1528/”