суббота, 10 декабря 2016 г.

NW.js и Javascript для десктопа

Как-то летом, просматривая одну лекцию, пришла в голову мысль о том, что неплохо иметь какую-нибудь штуковину на десктопе, которая бы показывала из папки какие-нибудь tip of the day,  которые бы раз в день менялись, позволяя освежать знания в голове. 

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

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

Спустя некоторое время, будучи довольно ленивым,  я подумал: а что если использовать какой-нибудь новомодный фреймворк для написания десктопных приложений на JavaScript? Сначала хотел взять Electron, но потом решил попробовать что-то другое и взял NW.js . Всё же его использует Construct 2 , который довольно крут, а значит оно того стоит.

Результатом стала вот такая штука


В целом получилось очень неплохо, по моему мнению, т.к. при кодировании визуальной части я вдохновлялся стилями RocketDock .  Большей частью то, что получилось меня устраивает, даже по памяти (все три процесса в памяти весят не более 31 МБ, что не так уж и много для полноценного браузера).

К плюсам NW.js и данного подхода можно ещё отнести то, что приложение на них создается не просто быстро, а ОЧЕНЬ БЫСТРО. Реально, первый рабочий набросок у меня получился уже через полчаса, ну и возможность менять стили на ходу чертовски круто и удобно. Ну и отладка оказалась неожиданно простой.

Минусов к сожалению тоже пока хватает и оказались они не там, где я ожидал:
  • Верстка с использованием CSS всё равно довольно болезненная, если вы хотите сделать нетрививальный графический эффект.
  • Иногда при сворачивании в трей и клике на открытие программа не возвращается в обратное состояние. Непонятно почему, потому что спустя буквально пару секунд это срабатывает. У нативных приложений таких проблем нет, что самое интересное.
  • Нельзя сделать полноценный эффект frosted glass, так как -webkit-blur размывает содержимое блока и все что угодно, кроме того, что находится под окном. Это можно решить, если на долю секунды после перемещения скрывать окно, делать снимок экрана и, делая новую часть подложкой окна, размывать её. Можно в принципе и сделать модулем NPM, но хотелось бы не кодить нативную часть там где это можно не делать. Почему это не сделано - в принципе понятно: фича сложная и делать её тяжело, но было бы неплохо её иметь 
  • Нельзя сделать, чтобы окно было всегда под остальными. Always On Top в NW.js, а вот Always On Bottom - нет. В принципе, можно сделать это через периодический вызов SetWindowPos, но опять же - это нативное расширение, опять разбираться c взаимодействием всех этих частей и это делать не хочется.
  • Две вики - на гитхабе и на основном сайте. Более актуальна та, что на основном сайте, но гайд  по тому, как собрать всё в красивый EXE-шник лежит на гитхабе, а на основном сайте нет. А зря.
  • Сборка проекта в нативное приложение немного болезненна. Сначала я попробовал Web2Executable, но оно не взлетело. Пришлось мучиться: сначала ставить новую Node.JS, затем nw-builder  и лишь потом собирать его. Что самое грустное - итоговое приложение имеет стандартную иконку, а не ту, что указана в проекте. В принципе можно и через Resource Hacker подправить, но все равно неприятно. Не собирать тоже неприятно: в таком случае запуск приложения заставляет висеть на рабочем столе пустую консоль, что хоть и допустимо, но не хотелось бы, так как приложение в моем случае должно было работать в фоне.
Если посмотреть внимательно - мои замечания на самом деле по сути мелкие и решаемы оформлением добавлением нативного кода в виде модулей или стороннего приложения. 

Если не нужно всё то, что я описал выше вам не нужно - NW.js просто замечателен. Его действительно стоит попробовать, если вы хотите накидать по-быстрому десктопное приложение.

Сама модель предлагаемая NW.js и Electron действительно видится своего рода путём в будущее: быстро разработанный интерфейс и куча вспомогательных сервисов и модулей, взаимодействующих с системой. Такое будет достаточно легко поддерживать и на команду разработчиков это ложится легко (одного сажаем лабать JavaScript, остальных писать сервисы, раз-раз и готово).  Разворачивать правда более сложные вещи на пользовательских компах будет сложно (на организацию удобной развертываемой версии в моем случае было потрачено много времени и я недоволен результатом, а нативных самописных модулей у меня не было ещё), но если такие системы это преодолеют (по большей части уже), то нативной разработке будет нанесён серьезный удар.

Комментариев нет:

Отправить комментарий