PWA против Flutter: подробное сравнение

Со всеми сложностями, возникающими между этими технологиями, понятно, что поначалу вы можете немного запутаться, пытаясь понять разницу между двумя технологиями — Progressive Web App и Flutter. В конце концов, в теории они звучат очень похоже, поскольку оба они могут использоваться для предоставления увлекательных возможностей на разных устройствах с использованием единой кодовой базы.

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

Краткий обзор

Что такое ПВА?

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

Это многообещающая новая технология; и в сочетании с массовым внедрением всеми большими парнями, включая Microsoft, с их недавним внедрением PWA в Windows, вы можете быть уверены, что отныне вы будете видеть только больше PWA.

Что такое флаттер?

Flutter, известный своей возможностью разработки с точностью до пикселя, представляет собой новейший SDK (Software Development Kit) с открытым исходным кодом от Google, который поможет вам выполнить свою работу, если вы хотите создавать мобильные приложения, которые выглядят и чувствуют себя как родное приложение, но при этом сохраняют свою актуальность. доступная кроссплатформенность. Это означает, что приложения Flutter создаются с учетом единой базы кода, что существенно снижает затраты на разработку.

Это может выглядеть очень похоже на прогрессивное веб-приложение, но мы можем заверить вас, что базовые механизмы, которые делают возможным все эти нативные приложения, сильно отличаются.

Вникая в детали

Язык

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

Flutter, с другой стороны, использует язык программирования Dart . Dart — это полностью объектно-ориентированный язык программирования, и, поскольку он имеет стиль синтаксиса на основе C, его легко изучить и освоить, если вы знакомы с подобным стилем синтаксиса. Более того, Dart можно скомпилировать в код ARM и x86, а с более новой версией Flutter вы даже можете ожидать, что сможете транспилировать его в JavaScript, чтобы ваш код Dart мог эффективно работать в Интернете.

Сложность

Поскольку PWA основан на JavaScript, который является более старым и более зрелым языком, вы можете ожидать, что кривая обучения будет более снисходительной, поскольку вам доступно множество фреймворков и библиотек JavaScript, из которых вы можете выбирать. Flutter — гораздо более новый язык — на первый взгляд может показаться немного более сложным, поскольку все, от пользовательского интерфейса до логического кода, может казаться более или менее смешанным во Flutter. А поскольку во Flutter в основном все является виджетом , вы можете оказаться в ситуации, когда вы столкнетесь с необычно большим, глубоким и сложным «деревом виджетов».

Производительность

Когда дело доходит до производительности, эти два устройства находятся на одном уровне друг с другом, а не в одностороннем порядке, как можно было бы ожидать. По сравнению с приложением Flutter типичное PWA должно немного снижать производительность при попытке «общаться» напрямую с собственным кодом, поскольку PWA часто все еще приходится использовать мост JavaScript для получения доступа к базовым функциям устройства. , например, GPS, камера и т. д.

Однако при взгляде на тесты становится ясно, что фреймворки JavaScript, например, NodeJS , могут работать на одном уровне, если не лучше, чем Dart (основа приложений Flutter) в нескольких случаях.

Это связано с тем, что JavaScript может лучше использовать многоядерный характер современных процессоров и более равномерно распределять рабочие нагрузки, несмотря на то, что сам язык является однопоточным по своей природе. С недавним модулем worker_threads , представленным NodeJS, который позволяет использовать потоки для параллельного выполнения процесса JavaScript, JavaScript теперь может лучше справляться с рабочими нагрузками, интенсивно использующими ЦП, и фактически может превзойти такие языки, как Dart.

Функции

Несомненно, Flutter — SDK, созданный специально для кроссплатформенной разработки мобильных приложений, — гораздо более функционален, чем PWA, построенный на технологиях Интернета. Приложения Flutter имеют более глубокую интеграцию с системой и, таким образом, могут использовать больше встроенных функций устройства.

Более того, когда дело доходит до общего пользовательского опыта, Flutter имеет здесь преимущество, поскольку он использует философию идеального пикселя, с помощью которой пользователи как на платформах iOS, так и на Android могут получить одинаковый беспроблемный опыт.

Это связано с тем, что Flutter отображает свои собственные компоненты пользовательского интерфейса, в отличие от большинства других фреймворков, использующих собственные компоненты платформы. Таким образом, приложения Flutter гораздо более согласованы между устройствами, но, следовательно, типичный размер приложения Flutter значительно больше, чем типичный PWA. Простое «Привет, мир!» Например, приложение Flutter может иметь размер более 7 МБ, в то время как PWA с тем же содержимым никогда не превышает отметку в 1 МБ.

Сценарии использования

Итак, когда следует выбрать один из них? Что ж, здесь все становится сложно (это то, что она сказала), поскольку они оба могут предоставлять практически одинаковый пользовательский опыт на разных платформах и разных устройствах. Ключевым моментом является то, какую сильную сторону этих технологий вы предпочитаете больше — охват или пользовательский опыт.

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

Приложение Flutter, с другой стороны, и его философия идеального пикселя, может сделать взаимодействие с приложением намного более привлекательным, оставаясь при этом экономически эффективным решением для бизнеса, поскольку для Android и Android требуется только одна база кода. платформы iOS.

Примеры

Из собранных нами приложений PWA и Flutter наиболее заметными являются те, которые, по нашему мнению, лучше всего отражают их возможности:

Флаттер - Нью-Йорк Таймс

Flutter начал свою новую главу совсем недавно, в середине 2019 года, поскольку его потенциал был подтвержден новой веб-версией Flutter игры KENKEN от New York Times.

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

PWA — Twitter Lite

Можно сказать, что Twitter Lite является самой успешной реализацией PWA, поскольку он делает то, что PWA делает лучше всего — обеспечивает привлекательный, похожий на приложение опыт на разных устройствах. Пользователи, которые хотят испытать Twitter PWA, могут запустить приложение на любом устройстве, о котором они могут подумать, будь то настольный компьютер, мобильный телефон или планшет…

И основное отличие наиболее эффективных PWA по сравнению с приложениями Flutter той же производительности заключается в том, что общий размер вашего PWA не должен занимать более 2 МБ на вашем устройстве.

После преобразования своего веб-сайта в PWA Twitter добился впечатляющих результатов. Цифры говорят сами за себя:

• снижение показателя отказов на 20%,
• 65% увеличение количества страниц за сеанс,
• На 75 % увеличилось количество отправленных твитов.

 Статья по теме: 12 примеров прогрессивных веб-приложений для вашего вдохновения

Flutter PWA, это возможно?

Веб-поддержка Flutter уже обсуждается и находится на стадии бета-тестирования. Процесс создания вашего Flutter доступным в Интернете может быть таким же простым, как компиляция Dart в JavaScript вместо того, чтобы компилировать его в машинный код ARM, который используется для мобильных приложений.

Тем не менее, есть некоторые сложности, которые немного усложняют достижение всего этого; но, как видно из приведенной выше игры KENKEN от New York Times, можно сделать достойную веб-реализацию приложений Flutter, и Flutter PWA, вероятно, скоро появится.

Вывод

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

В SimiCart мы являемся признанным Google агентством по разработке PWA, готовым привнести в ваш магазин Magento возможности совершения покупок нового поколения.

Читать далее:
PWA против Electron: глубокое погружение

Что такое ПВА? Все, что вам нужно знать о Progressive Web App

Magento PWA Studio против Vue Storefront: какой из них для вас?