Как стать автором
Обновить

Chromeless: интерфейс браузера своими руками (HTML, CSS и JS)

Время на прочтение2 мин
Количество просмотров7.2K
Вам никогда не хотелось улучшить привычный интерфейс браузера? Может быть, вы даже пытались сделать это. Если да, то наверняка использовали технологии вроде XUL и XPCOM. Например, в Firefox большая часть интерфейса реализована с помощью XUL, который основан на стандартных веб-технологиях, таких как DOM и JavaScript. Это всё сделано для удобства разработки расширений к браузеру, но в то же время является некоторым барьером, который защищает интерфейс от вмешательства извне.

А если бы ключевые элементы UI были сделаны с использованием HTML, CSS и JavaScript? Cложно представить, какие бы дизайнерские идеи и новые концепции появились на свет, если б интерфейс браузера можно было кромсать на манер веб-страницы.



На скриншоте показан пример очень простого браузера с уменьшенными скриншотами страниц вместо табов.

Это браузер Chromeless, который сделан исключительно в демонстрационных целях, чтобы показать возможности использования HTML для интерфейса. Вместо XUL элементы браузера выполнены в виде фреймов. Приложение функционально и призвано продемонстрировать главную идею проекта.

Текущая реализация Chromeless представляет собой смесь расширения Cuddlefish Lab и Jetpack SDK вместе с XULRunner. Применение этих технологий Mozilla позволяет создавать приложения на базе XULRunner с чистого листа.

Вместо загрузки XUL, главным исполняемым файлом приложения является файл HTML. Эта страница имеет различные привилегии, например, имеет доступ к модулям CommonJS от Jetpack. Таким образом, задача сводится к тому, чтобы функционал браузера можно было описать через эти модули.



Возможность такого решения доказывает вышеуказанный прототип, способный загружать и рендерить HTML-страницы. В ближайшие месяц разработчики собираются добавить специфические API для более осмысленного дизайна. Изучаются и вопросы безопасности.

Принять участие в эксперименте приглашаются все желающие. Исходники и инструкции на github.com/mozilla/chromeless, общение в группе Mozilla Labs Group и на IRC-канале #labs на irc.mozilla.org.

via Mozilla Labs
Теги:
Хабы:
Всего голосов 38: ↑30 и ↓8+22
Комментарии28

Публикации

Истории

Ближайшие события