Миграция пользовательского интерфейса на основе Adobe Flex на новые платформы

Question

Когда Adobe Flex подошел к концу, мне стало интересно, какие процедуры вы выполняли, можете ли вы подумать или перейти на последний пользовательский интерфейс (HTML5, AngularJS)?

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

Answer 1

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

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

Так что в основном ваш

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

Answer 2

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

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

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

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

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

Answer 3

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

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

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

Answer 4

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

Answer 5

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

Answer 6

Это большая задача по переносу проекта 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. Оттуда вы лучше поймете, как разработать стратегию миграции.