Блог

Поскольку срок службы Adobe flex подходит к концу, мне было интересно, каким процедурам вы следовали или можете подумать о переходе на последнюю версию пользовательского интерфейса (HTML5, AngularJS)?

Все ссылки указывают на плюсы и минусы этого. Однако у меня возникли проблемы с пониманием того, какие шаги требуются при переносе технологии пользовательского интерфейса.

Другим вариантом для вас может быть Apache Royale. Это эволюция Flex Framework, которая позволяет переносить код AS3 в Javascript / HTML5. Хотя это и не идеально, это простой способ перенести устаревшие проекты, чтобы они продолжали работать.

На данный момент вам нужно будет только изменить свой пользовательский интерфейс со старых тегов Flex на новые, хотя люди пытаются заставить старые компоненты Spark эмулировать в новой системе.

Итак, в основном ваш

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

Мы выполнили несколько из этих миграций сейчас, и простой ответ — «это зависит». Есть несколько вопросов, на которые вам нужно ответить:

• Возможно ли конечным пользователям устанавливать ваше приложение локально, а не получать к нему доступ через веб-браузер? (Подразумевает незначительное взаимодействие между вашим приложением Flex и содержащей его страницей HTML / JS ..). Если ответ положительный, то миграция становится намного проще, поскольку вы можете либо использовать AIR (согласно другому ответу), либо использовать пакетное решение для хранения и развертывания вашего приложения как есть (практически не работает для вас, но это коммерческое решение, поэтому стоит денег ..)

• Вы довольны сохранением исходного кода в MXML / AS3 или предпочитаете перенести все это на другой язык (TypeScript или JavaScript)? Если вы хотите сохранить код в MXML / AS3 — и использовать большую его часть повторно, — тогда Apache Royale — это выбор, поскольку в нем есть транспилятор для преобразования MXML / AS3 в JavaScript. Если вы не хотите использовать MXML / AS3, тогда вам нужно выбрать новую платформу TS / JS..

• У вас много вызовов к API Flash или только к API Flex? Apache Royale действительно поддерживает множество функциональных возможностей, эквивалентных тому, что есть во Flash (события, утилиты и т.д.), Но в основном он ориентирован на API Flex. Предпринимаются даже попытки добиться сопоставления компонентов Flex с новыми компонентами Royale примерно в соотношении 1: 1, чтобы еще меньше затрачивать на перенос. Но API-интерфейсы Flash часто необходимо конвертировать вручную (например, мы создали ряд реализаций в Royale для классов flash.media.*).

Чем больше я использовал Royale, тем больше он мне нравился. Для начала нужно немного освоиться, но когда вы понимаете, что любой компонент JavaScript также может быть доступен из этого, он становится довольно мощным. Лучше всего предоставлять оболочки для такого рода вещей (таким же образом, как вы можете получить определения TypeScript для них), Поскольку тогда вы получаете преимущества проверки типов и т.д. Из набора инструментов.

Я нахожусь в процессе переноса массивного корпоративного веб-приложения с Flash / Flex на Apache-Royale. Для большого приложения со сложной бизнес-логикой платформа Apache-Royale оказала огромную помощь. Хотя логика некоторых компонентов отличается, она достаточно похожа, чтобы вы могли довольно легко поменять местами, как только достигнете вершины кривой обучения. Тот факт, что я смог сохранить большую часть бизнес-логики и структуры приложения, спас мой проект от глубокой переработки, которая заняла бы гораздо больше времени. Я бы сказал, что если ваше приложение большое и сложное, Apache-Royale может быть вашим лучшим решением для экономичного переноса.

Боюсь, что Flex умер несколько лет назад. В свое время я был разработчиком flex. Должен сказать, что переход с Flex / Actionscript на React был для меня непростым. Я обнаружил, что сходство между языком разметки (например, MXML или JSX (React)) и языком кодирования (Actionscript или Javascript (React)) немного помогло. Если вы хорошо разбираетесь в Javascript, это поможет, если вы не изучили основы. Использование React или другого фреймворка означает также использование инструментария, пакета (обычно webpack), вам также понадобятся практические знания Babel. Я бы выбрал React, потому что я предвзят и он очень популярен. Дайте мне знать, если вы приведете какие-либо ссылки, которые я сочту полезными. Наконец, я бы сказал, просто избегайте Flex -> JS tools, просто смиритесь с этим, улыбайтесь и изучайте материал, который поглощает Интернет….

Мы перенесли два модуля Flex в AngularJS несколько лет назад. Вот процедура, которой мы следовали:

• перенесен код бизнес-логики из интерфейса Flex в серверную часть, чтобы его можно было повторно использовать из интерфейса AngularJS (да, у нас был этот король кода!)
• Flex использует BlazeDS Framework для взаимодействия с серверной частью. Это позволяет серверу передавать информацию клиенту. В этом случае вам нужно найти технологию замены, такую как веб-сокеты или события, отправляемые сервером. Мы только что провели длительный опрос
• Серверная часть: почти весь код бизнес-логики содержался на уровне сервиса. Мы написали REST API поверх этого слоя, чтобы предоставить API для AngularJS. Flex использовал тот же уровень сервиса, что и через BlazeDS
• Интерфейс: Если ваш интерфейс сложный, вам нужно найти фреймворки JS, которые обеспечивают аналогичную функциональность с Flex. У нас были круговые / столбчатые диаграммы в Flex; мы рисуем эти диаграммы с D3.js

Нам пришлось выполнить эту миграцию, потому что маркетологи решили, что мы должны запустить frontend app на мобильных устройствах в обеих операционных системах: Android и iOS.

Перенос проекта Flex на HTML / Javascript — это серьезное мероприятие. Во-первых, если ваша пользовательская база в порядке с настольным приложением (вместо того, чтобы запускать ваше приложение в браузере), вы можете пропустить миграцию и использовать Adobe AIR для упаковки приложения.

Если приложение требуется для запуска в браузере, вам необходимо перевести его на современную платформу, такую как Angular, React или Vue. Я подробно исследовал эти фреймворки и пришел к выводу, что Angular / Typescript наиболее близок к Flex и является лучшим выбором для моего проекта миграции, однако частично этот выбор обусловлен личными предпочтениями. Мой опыт:

1. Код ActionScipt (AS3) легко переводится на Typescript
2. Перевод кода mxml — это сложная часть. Все компоненты, которые поставляются «из коробки» в Flex (от простых элементов пользовательского интерфейса до диаграмм и сеток данных), должны быть заменены библиотеками сторонних производителей. Требуется дополнительное исследование / выбор.
3. Верстка в Flex очень проста. В HTML с CSS / flexbox все сложнее. Здесь нет простого перевода

К сожалению, это большая кривая обучения. В качестве первого шага изучите / напишите небольшой проект на Angular или Vue. В обоих есть собственный TypeScript, и он близок к AS3. Оттуда вы лучше поймете, как планировать миграцию.