company_banner

Кунг-фу стиля Linux: превращение веб-приложений в полноценные программы

Original author: Al Williams
  • Translation
Мне неприятно это признавать, но я, на самом деле, больше не работаю в Linux на настольном компьютере. С технической точки зрения я, всё же, пользуюсь Linux. Но 95% своих дел я делаю в Chrome. Среди обычных приложений, которые я ещё применяю, остались лишь инструменты разработки, командная оболочка, emacs и GIMP. А если бы мне было очень надо, то я, возможно, нашёл бы браузерную замену всем этим программам. Почтовый клиент? Gmail. Ведение блога? WordPress. Заметки? OneNote или Evernote. Хорошо бы запускать это всё в виде полноценных приложений, а не открывать во вкладках браузера. Сегодня я расскажу о том, как это сделать.



Работа с приложениями в Chrome может привести к появлению настоящих проблем. У меня, после некоторой оптимизации рабочих процессов, открыты десятки вкладок. И меня это, всё равно, не устраивает. Перезапуск Chrome — это настоящий кошмар, так как он пытается сразу же загрузить сотню вкладок. (Кстати, вот совет в тему: перейдите по адресу chrome://flags и выключите опцию Offline Auto-Reload Mode, а опцию Only Auto-Reload Visible Tabs включите). Я, кроме того, трачу много времени на поиск нужной мне вкладки, так как пытаюсь группировать вкладки по отдельным окнам браузера. То есть, например, мне нужно сначала найти окно, в котором открыта вкладка Gmail, а потом уже найти саму эту вкладку среди примерно двух десятков вкладок, открытых в этом окне.

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


В окне браузера открыто слишком много вкладок

Electron


Существует один проект, Electron, позволяющий веб-разработчикам упаковывать свои программы в настольные приложения. В сообществе разработчиков сформировалось неоднозначное отношение к этому проекту. Так, его критики говорят о том, что веб-приложения неэффективны. Но непохоже, что у меня есть возможность создать «правильное» настольное приложение Gmail. Поэтому не думаю, что веб-приложение Gmail, обработанное средствами Electron, будет работать гораздо хуже, чем оно же, постоянно открытое во вкладке браузера.

Теоретически можно просто воспользоваться Electron для «разработки» собственной версии Gmail или любого другого веб-приложения. Но на это потребуется некоторое время. Поэтому я решил прибегнуть к помощи проекта nativefier, который автоматизирует большую часть задач по превращению веб-приложений в приложения настольные. Программа способна взять практически любую веб-страницу (или любое веб-приложение) и превратить её в приложение, предназначенное для запуска на Windows, Linux или на Mac.

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

Быстрая проверка


Предположим, нам надо сделать Linux-приложение из веб-проекта Microsoft OneNote. Настольное приложение OneNote, конечно, существует, но не для Linux. Оно работает под Wine, но веб-приложение лучше поддерживается и обновляется, да и пользоваться им удобнее, чем его вариантом, выполняющимся в Wine.

Вероятно, первой попыткой сделать из OneNote настольное приложение будет выполнение такой команды:

nativefier onenote.com

Но у такого подхода есть одна проблема. Хотя программа собирает все необходимые данные, она не берёт пароли и кешированные учётные данные из браузера. Это значит, что для работы с приложением нужно войти в OneNote.


Настольный вариант OneNote, созданный с помощью nativefier

Попробуем это сделать. Щелчок по кнопке входа в настольной версии OneNote ведёт на какой-то другой сайт Microsoft который открывается в обычном браузере. Если войти в систему через обычный браузер, это ничего не изменит.

Значит ли это, что nativefier не получится использовать для создания настольных вариантов OneNote или любого другого проекта, в который нужно входить? Нет, не значит.

Решение проблемы


Если вы решите посмотреть справку по nativefier (с использованием опции --help), то вы обнаружите, что эта утилита поддерживает невообразимое количество опций командной строки. Например, можно переназначить используемые по умолчанию значок и название будущей программы. Можно задавать различные параметры, касающиеся браузера. Можно даже внедрить в проект собственный CSS-код, задать размер окна и, если надо, включить вывод браузерных меню. Если же говорить о нашей проблеме, то тут нам поможет опция --internal-urls. Тут задаётся регулярное выражение, которое программа будет применять, принимая решение о том, где открывать ссылки — в окне программы или в обычном браузере. Если URL соответствует регулярному выражению — ссылка откроется в окне программы. Для того чтобы подобрать подходящее регулярное выражение, может потребоваться время. И регулярное выражение, конечно, может быть настолько строгим, насколько это нужно. Я остановился на такой команде запуска nativefier:

nativefier onenote.com --internal-urls ".*(\\.office\\.com)|(\\.onenote\.com)|(go\\.microsoft\\.com)|(\\.live\\.com).*"

Если перевести это всё на обычный язык, то окажется, что URL, оканчивающиеся на .office.com, .onenote.com и .live.com, рассматриваются программой как «внутренние», открываемые в её окне. К таким URL относятся и те, которые ведут на go.microsoft.com. Вероятно, я мог бы просто взять и включить сюда все URL с microsoft.com. Но если имеется некая реальная ссылка на microsoft.com, ведущая за пределы OneNote и не участвующая в обеспечении работоспособности программы, то её, вероятно, лучше будет открыть в обычном браузере.

Опять же, тут всё можно настроить в соответствии со своими нуждами. Если вы, например, знаете о том, что никогда не будете выходить за пределы приложения, то можно, в роли регулярного выражения, просто воспользоваться конструкцией вида .*. Но у меня такое ощущение, что лучше не лениться и немного поразмыслить над тем, что открывать в программе, а что — во внешнем браузере.

Программы


Любую веб-страницу, с которой хочется работать как с самостоятельной программой, можно обработать с помощью nativefier, и эта страница будет нормально функционировать. Я даже упаковал в отдельное окно чат на hackaday.io. С тем, что получилось, удобно работать. Даже хотя для аутентификации в чате используется GitHub, это сделано так, что не запутывает nativefier и не требует использования особых команд при создании приложения.


Чат в настольном приложении

Вот ещё некоторые сайты, которые хорошо работают в виде обычных приложений: messages.android.com (тут, правда, нужна своя иконка), сайт WordPress и, конечно, сайт Gmail. А вот — команда для создания настольного варианта ещё одного хорошего проекта:

nativefier http://falstad.com/circuit/circuitjs.html?cct=$+1+0.000005+10.20027730826997+50+5+50%0A --name 'Falstad Circuit Simulator'


Проект Falstad Circuit Simulator, оформленный в виде настольного приложения

Итоги


Если вы не пользуетесь браузером по тому же сценарию, что и я, то вам, возможно, и не пригодится nativefier. Или, возможно, вы иначе подходите к работе с большим количеством вкладок. Но если вам нужно преобразовать некое веб-приложение в настольную программу, то могу сказать, что nativefier хорошо справляется с этим делом. В моём случае это упростило решение некоторых важных задач.

Правда, у nativefier есть и некоторые проблемы. Например, внутри «упакованных» приложений не работает проверка правописания. То есть, возможно, WordPress — это не лучший кандидат на превращение в настольное приложение. Но в некоторых программах, вроде Falstad Circuit Simulator, отсутствие проверки правописания попросту незаметно. В GitHub-репозитории проекта есть задача с предложением это исправить. Если это будет сделано, то nativefier станет ещё лучше и полезнее.

Возникало ли у вас желание сделать из какого-нибудь веб-сайта настольное Linux-приложение?



RUVDS.com
VDS/VPS-хостинг. Скидка 10% по коду HABR

Comments 17

    +15
    Нет, это не полноценные программы. Это тормозящие и жрущие ресурсы поделия, которые только прикидываются полноценными.
      +1
      Полноценные приложения могли бы работать с локальными папками, добавить иконку в трей, работать в фоне — без окна, и так далее.
        +5
        Электрон это умеет. Только надо делать приложения под него изначально, а не упаковывать сайты этой тулзой.
        +9
        Казалось бы, при чем здесь вообще Linux?
        +5
        А я просто закрываю вкладки…
          +3
          К сожалению для каждого такого приложения будет грузиться в память еще одна копия JS движка V8, а весит она не мало! Так что в плане быстродействия и использования памяти, это весьма не эффективное решение
            0
            Не должны. Разделяемые библиотеки на то и разделяемые, что копия в память грузится только одна.

            P.S. Ну если конечно этот nativefier загружает их из одного и того же файла, а не из разных.
              +1

              Вы смешиваете код и данные. Код разделяемой библиотеки да, подгрузится разок, а вот контекст будет создаваться уже столько, сколько нужно.

            0

            А блокировщик рекламы как добавите?

              +7

              Я дико извиняюсь, но чем это отличается от функции "Создать ярлык" в Хром(иум)е? С опцией "Открывать в отдельном окне".

                0
                например, тем, что может работать в трее. Правда, наверное, это и единственное отличие)
                0

                Получится запустить MS Teams на десктопе под другой учеткой?

                  0

                  Конечно. Не знаю как в nativefier, в electron у каждого приложения данные хранятся независимо.

                  +1

                  У хрома есть аргумент --app=https://gmail.com который запустит страницу как приложение без посторонних библиотек. С гмайлом не пробовал но должно тоже сработать.

                    0

                    Электрон очень хорош для MVP: дёшево, быстро, работает более менее. Когда продукт уже показал себя, по хорошему бы переписать на полноценное)


                    А вот тут, в статье, вообще упаковка сайта в оболочку нэйтифаера)) На ryzen 7 работает вполне адекватно, но, как по мне, удобство сомнительное, жрёт неоправданно много и браузер быстрее.


                    И да, зачем 300 вкладок одновременно?

                      0
                      я не автор, но тоже использую 7 — 8 окон браузера полностью забитых вкладками — 300+. Держу онлайн там всем нат чем работаю, что читаю, что хочу помнить.

                    Only users with full accounts can post comments. Log in, please.