О плане кроссплатформенного развития мобильного терминала на 2018 год

JavaScript HTML Flutter CSS Weex React Native PWA
О плане кроссплатформенного развития мобильного терминала на 2018 год

Write once, run anywhere.

введение

«Напиши один раз, работай где угодно» — это лозунг, используемый SUN для демонстрации кроссплатформенных возможностей языка Java, а это означает, что Java можно разрабатывать на любой платформе, а после компиляции запускать на любом компьютере с Виртуальная машина Java (JVM) установлена, запущена на устройстве.

Единственным недостатком является то, что виртуальная машина Java имеет множество различных реализаций в различных операционных системах (Windows, Linux, macOS, ...), в результате чего приложения Java имеют тонкие различия при выполнении на разных виртуальных машинах и операционных системах. , так что может потребоваться его полное тестирование на многих платформах для обеспечения точности и стабильности, что превращает печать в анекдот: «компилировать один раз, везде отлаживать».

За последние два года в мобильных устройствах появились различные кроссплатформенные программы разработки мобильных устройств, с одной стороны, потому что с популярностью и быстрым развитием мобильного Интернета аппаратное и программное обеспечение мобильных терминалов, операционная система, цепочка инструментов разработки и технологическое сообщество Я стал более зрелым и улучшенным, с другой стороны, в последние годы традиционные ПК-терминалы постепенно перешли на мобильный терминал, все хотят строить колеса, а затем «одна неделя».

«Кроссплатформенность» тоскует по погоне за каждым разработчиком новой технологии, но и кошмар консерваторов, потому что они хотятнатуральная кожаНативно разработан для Android и iOSЖизнь.

Эта статья относится к середине 2018 года и рассказывает о наиболее популярных решениях для кроссплатформенной разработки, доступных в настоящее время.

Веб-интерфейс / HTML 5

Мы знаем, что в веб-интерфейсе веб-программирования используется комбинация HTML + CSS + JS, где HTML используется для определения структуры страницы, CSS используется для описания внешнего вида страницы, а JS обычно используется для обработки страницы. логика и взаимодействие с пользователем.

С выпуском стандарта HTML 5 в 2014 году развитие фронт-энда в последние годы было чрезвычайно горячим. все более сложные потребности в разработке.Angular, Vue, React и другие различные шаблоны разработки постоянно создаются и итеративно обновляются.

Многие думают, что кроссплатформенность ненадежна, но на самом деле Веб — это самый успешный пример кроссплатформенной разработки в истории, настолько успешный, что к нему все привыкли, и даже забыли, что были Б/С и К/С больше десяти лет назад, а как насчет битвы?

Hybrid App

Мы можем назвать веб-страницы, разработанные с использованием чистой фронтальной технологии, веб-приложением, а приложения, разработанные с использованием чисто нативной технологии, — нативным приложением.У них есть свои преимущества и недостатки: чисто нативная итерация слишком медленная, не может обновляться динамически и не может быть кросс-платформенный. В Интернете есть много функций, которые невозможно реализовать. Хотя его анимационный эффект неудовлетворителен, он все еще немного далек от оригинала.

Гибридное приложение (гибридное приложение) относится к приложению между ними, которое имеет как «преимущества хорошего взаимодействия с пользователем в родном приложении», так и «преимущества кроссплатформенной разработки веб-приложений».

Техническая суть Hybrid заключается в установлении моста JS Bridge с собственным клиентом на основе WebView, чтобы достичь цели JS, вызывающей Native API, и Native, выполняющей JS-методы.

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

Кроме того, будет следующееReact Native, Weex,PhoneGap/Cordova, AppCan и другие решения для разработки также относятся к категории гибридных приложений.

React Native

Build native mobile apps using JavaScript and React

React Native (сокращенно RN) — это кроссплатформенная платформа для разработки мобильных приложений, исходный код которой был открыт Facebook в апреле 2015 года. Это производная от более ранней платформы пользовательского интерфейса Facebook с открытым исходным кодом React на собственной платформе мобильных приложений. В настоящее время она поддерживает две платформы: iOS. и Андроид. Он использует язык JavaScript, а также HTML-подобный JSX и CSS для разработки мобильных приложений, поэтому технические специалисты, знакомые с разработкой веб-интерфейса, могут быстро приступить к работе с минимальным обучением.

После более чем 3 лет разработки React Native стал относительно зрелым.Хотя версия 1.0 еще не выпущена, ее сообщество очень активно и внесло много открытого исходного кода в React Native.

Многие отечественные компании также провели много исследований React Native и имеют соответствующие результаты, такие как некоторые кросс-терминальные (Android/iOS/Web) технологии, разработанные на основе React Native.

Weex

A framework for building Mobile cross-platform UIs

21 апреля 2016 года Alibaba представила кроссплатформенный инструмент мобильной разработки Weex на конференции Qcon, а 15 декабря того же года Alibaba объявила, что передаст мобильный проект с открытым исходным кодом Weex в Apache Foundation для инкубации.

Weex стремится предоставить разработчикам возможность создавать приложения для Android, iOS и веб-приложения, используя один и тот же набор кода на основе современных передовых технологий веб-разработки. В частности, после интеграции WeexSDK вы можете использовать JavaScript и популярные интерфейсные фреймворки, такие как Vue.js и Rax, для разработки мобильных приложений.

Еще одна основная цель WeEx — следовать технологиям современной передовой веб-разработки и нативной разработки, которые сочетают в себе производительность и производительность. Разработка страницы WeEx аналогична разработке обычной страницы; при отображении страницы WEEX то же самое.

Мы можем обнаружить, что Weex в значительной степени заимствовал идеи и методы React Native. Цель состоит в том, чтобы отображать страницы Native с помощью синтаксиса JS. Однако из-за позднего старта сообщество не проявляет активности в React Native, и есть относительно мало материалов и проектов с открытым исходным кодом.

Flutter

Build beautiful native apps in record time

Flutter — это платформа для разработки мобильного пользовательского интерфейса, запущенная Google на Google I/O 2017, которая позволяет быстро создавать высококачественные нативные пользовательские интерфейсы для iOS и Android. Он также станет основным инструментом для разработки приложений в рамках новой системы Google Fuchsia.

В конце февраля 2018 года Google открыл исходный код на GitHub и выпустил первую бета-версию Flutter, а в мае запустил бета-версию 3 на Google I/O 2018. Мы отправили статью перед нашим публичным аккаунтом.Обзор новых возможностей Flutter Beta 3

Здесь необходимо подчеркнуть, что Flutter существенно отличается от React Native/Weex.Он не использует WebView, интерпретатор JavaScript или собственные элементы управления, которые поставляются с системной платформой, но имеет собственный набор виджетов, а Dart используется для интерфейса. development., а лежащий в основе рендеринг использует свой собственный высокопроизводительный движок C/C++ для рисования самого себя.

Кстати, про сравнение Flutter и React Native мы тоже два дня назад публиковали статью на нашем официальном аккаунте.«Flutter KO React Native? Пусть время решит…»

  • Официальный сайт флаттера:flutter.io/
  • Китайский сайт флаттера:flutterchina.club/
  • awesome-flutter на GitHub объединяет большую коллекцию ресурсов Flutter:Github.com/solid o/awes...
  • Кроме того, команда по сбору знаний открыла репозиторий на GitHub для сбора соответствующих ресурсов разработки Flutter в Китае.Приглашаем следить и совершенствоваться вместе с нами:GitHub.com/awesome-tip…

PWA

A new way to deliver amazing user experiences on the web.

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

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

  • Надежность — Мгновенная загрузка и отображение даже в нестабильной сетевой среде.
  • Опыт - отзывчивый, с гладкими анимациями в ответ на действия пользователей
  • Sticky — как родное приложение на устройстве, с иммерсивным пользовательским интерфейсом, который пользователь может добавить на рабочий стол.

Android и основные браузеры уже поддерживают стандарт PWA, и, наконец, в iOS 11.3 и macOS 10.13.4 Apple Safari также поддерживает PWA. Автор считает, что это приведет к взрыву PWA...

В статье «Модель веб-приложения следующего поколения — прогрессивное веб-приложение» подробно представлены тонкости и разработка PWA, которую стоит прочитать.

Апплеты

Суперприложения, такого как WeChat, с более чем 1 миллиардом активных пользователей в месяц достаточно, чтобы конкурировать с операционной системой, мы можем назвать его «системой WeChat». Если вы можете предоставлять свои собственные услуги в экосистеме WeChat, разработка приложений для «системы WeChat» может стать целью многих разработчиков.

Апплет WeChat — это приложение, которое можно использовать без загрузки и установки. Оно реализует мечту о «применимости» приложений. Пользователи могут открыть приложение, проводя пальцем по экрану или выполняя поиск в WeChat. 9 января 2017 года Чжан Сяолун официально выпустил мини-программу для WeChat Open Class Pro 2017 года и запустил мини-игру в конце 2017 года.

Разработка мини-программы — это, по сути, набор логики внешнего интерфейса HTML + CSS + JS, который разрабатывает и отображает страницы на основе WebView и набора JS/WXML/WXSS/JSON, определенного самим WeChat. В официальной документации WeChat упоминается, что апплет работает на трех терминалах: iOS, Android и инструменты разработчика для отладки.Среда выполнения скрипта и среда рендеринга ненативных компонентов на трех терминалах разные:

  • В iOS код JavaScript апплета выполняется в JavaScriptCore, который обрабатывается WKWebView, а среда — iOS 8+;
  • В Android код JavaScript апплета анализируется X5 JCore и обрабатывается X5 на основе ядра Mobile Chrome 53/57;
  • В инструменте разработки код JavaScript апплета выполняется в nwjs и отображается с помощью Chrome Webview.

Для получения более подробной информации посетите официальный сайт мини-программы WeChat:

Позже Alipay запустила собственную мини-программную платформу:

Поскольку WeChat или Alipay могут работать на Android и iOS, в некотором смысле мы также можем понимать апплет как своего родаКроссплатформенная разработка.

Быстрое приложение

20 марта 2018 года Xiaomi, ZTE, Huawei, Gionee, Lenovo, Meizu, Nubia, OPPO, vivo, OnePlus, в общей сложности десять производителей мобильных телефонов, провели в Пекине конференцию по быстрому запуску стандарта приложений и запустили новую экосистему приложений. Официальное описание выглядит следующим образом:

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

Мы можем обнаружить, что он похож на апплет, и он также использует стек интерфейсных технологий и нативную комбинацию, а также может быть «использованием по щелчку».

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

PhoneGap

Build amazing mobile apps powered by open web tech.

PhoneGap — это решение для быстрой разработки мобильных кроссплатформенных приложений с использованием технологий HTML, CSS и JavaScript. Первоначально разработанный Nitobi и теперь принадлежащий Adobe, он восходит к 2009 году и почти так же стар, как разработка для мобильных устройств.

Это позволяет разработчикам вызывать основные функции смартфонов, таких как iOS, Android, Windows Phone, Blackberry, Plam и т. д., на веб-странице, включая геолокацию, ускоритель, контакты, звук и вибрацию и т. д. плагинов для вызова.

Многие основные фреймворки для мобильной разработки в отрасли основаны на PhoneGap, наиболее известными из них являются Worklight, appMobi, WeX5 и т. д. Благодаря интеграции Phonegap они были глубоко оптимизированы, их производительность близка к родному приложению, а развитие удобство тоже хорошо.

Cordova

Говоря о PhoneGap, необходимо упомянуть Cordova, это разные названия одной вещи.

Как упоминалось выше, PhoneGap был разработан Nitobi в первые дни.4 октября 2011 года Adobe официально объявила о приобретении программного обеспечения Nitobi. Код PhoneGap внесен в Apache Software Foundation, но сохраняет право собственности на товарный знак PhoneGap и называется Apache Callback. После выпуска версии 1.4 название Apache Callback было изменено на Apache Cordova. - из Википедии

Автор не изучал разработку, связанную с PhoneGap/Cordova, пожалуйста, обратитесь к их официальному сайту за более подробной информацией.

AppCan

Лидер отечественной разработки гибридных приложений, мобильных платформ и мобильных облачных платформ

Автор понимает, что это китайская версия PhoneGap 😷, говорить без расследования не имеет права, подробнее смотрите на официальном сайте:

Xamarin

Xamarin — это кроссплатформенное программное обеспечение для разработки, предоставляемое дочерней компанией Microsoft с использованиемС#/.NETОбщая база кода, которая позволяет разработчикам писать собственные приложения для Android, iOS и Windows с собственными пользовательскими интерфейсами на инструментах Xamarin и совместно использовать код на нескольких платформах, включая Windows и macOS.

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

Ссылки на официальный сайт Xamarin и инструменты разработки:

More...

«Различные методы кроссплатформенной разработки мобильных терминалов», статья о технологии кроссплатформенной разработки делится на следующие четыре основные школы:

  • Веб-поток: также известный как гибридная технология, он реализует интерфейс и функции на основе веб-технологий.
  • Процесс преобразования кода: преобразуйте язык в Objective-C, Java или C#, а затем используйте официальные инструменты для разных платформ для разработки.
  • Процесс компиляции: компилируйте язык в двоичные файлы, генерируйте динамические библиотеки или упаковывайте в файлы apk/ipa/xap.
  • Потоковая передача виртуальной машины: запустите, перенеся языковую виртуальную машину на другую платформу.

В статье проводится технический анализ по этим схемам, которую стоит прочитать, ссылка на оригинал:

Какие еще кроссплатформенные решения, о которых вы не упомянули в этой статье, вы узнали? Добро пожаловать, чтобы оставить сообщение для обсуждения...

Эпилог

Эта статья кратко обобщает и представляет несколько кроссплатформенных решений для разработки, которые популярны на мобильном терминале. Ее можно рассматривать как введение. Обучение не делается за одну ночь. Для каждой технологии читатели должны потратить время на углубленное изучение.

Какая схема развития станет основной, никто из нас не знает, покажет время.

Однако нам не нужно беспокоиться о новых технологиях, которые последуют за ними: «Нам нужна наша собственная сила, чтобы ковать железо». технологические обновления и итерации. Действуй!

Ссылка на ссылку

Knowledge Xiaoji — это официальная учетная запись команды, в основном позиционирующаяся в области мобильной разработки, которая делится технологиями мобильной разработки, включая iOS, Android, апплеты, мобильный интерфейс, React Native, weex и т. д. каждую неделюоригинальныйОбмен статьями, наши статьи будут сначала опубликованы в общедоступном аккаунте. Добро пожаловать, чтобы обратить внимание, чтобы увидеть больше контента.