HTML стал для нас совершенно естественным способом взаимодействия с аудиторией в интернете. И мы уже даже не задумываемся над тем, так ли он удобен на самом деле, возможны ли более современные и удобные альтернативы? И в то же время мы так или иначе испытываем недовольство от использования HTML приложений, зачастую успокаивая себя мантрой: «Ну это же HTML, что от него ожидать?». Попытке решить эту проблему и найти альтернативу привычному HTML и посвящена эта статья.
А вы любите HTML? Возможно, вы его неистовый поклонник? Тогда вам лучше не читать эту статью – дальше будет больно!
Лично я так или иначе работаю с HTML с самого его начала. Я помню первые HTML страницы в интернете, которые представляли собой исключительно текстовый документ, картинки в котором были лишь иллюстрацией к тексту, но никак не элементами графического оформления страниц. Затем отдельные чудаки придумали делать на этих страницах «дизайн». Для технических специалистов того времени это было дикостью, зачем добавлять к информации ненужные, отвлекающие украшательства, которые, ко всему прочему, ещё и жутко тормозят загрузку страницы, ведь интернет в то время работал на модемах и был медленным. Однако чудаки были упорными и, после некоторого периода бесплатных «дизайнов», им наконец удалось начать продавать свои творения бизнесменам различного уровня и толка. Это и положило начало тому интернету, который мы знаем сейчас, где полно аляповатых сайтов и где до сих пор особо одарённые компании соревнуются в способности создать наиболее навороченный дизайн, обвешанный огромными панорамами или, ещё хуже, фоновыми видео. Но речь не об этом.
Как я могу вспомнить, с самого начала «дизайн» в HTML был в первую очередь борьбой за то, чтобы впихнуть творческую фантазию в рамки достаточно скудных возможностей HTML, который не был предназначен для художественного оформления страниц. Только спустя годы в HTML стали появляться всё новые и новые опции, позволяющие хоть как-то примирить творчество чудаков с суровой цифровой реальностью. Наблюдать со стороны за этим было забавно: никогда не оставляло ощущение, что на старую, ржавую садовую тележку пытаются прикрутить то колеса от жигулей, то штурвал от Ту-154. Тем не менее, много лет спустя HTML превратился в инструмент, на котором сейчас делают уже вполне серьёзные вещи. Впрочем, «садовая тележка» (DOM) все ещё проглядывает за ворохом модных фич. Отдельно стоит упомянуть инпуты, кастомизация которых в большинстве случаев сводится к тому, что нативные HTML input прячутся и вместо них показываются созданные вручную из HTML тегов и стилей. Конечно, работать со всем этим было неудобно и весьма трудозатратно, поэтому начали появляться различные JS фреймворки, пытающиеся хоть как-то компенсировать кривизну и неудобство HTML. Хорошо помню первые версии jQuery, который стал уже не модным, но до сих пор достаточно широко используется. Затем появились React, Angular, Vue (простите, если что-то пропустил). Всё это безусловно хорошие вещи. Только это всё ещё надстройка над той самой садовой тележкой, которая была создана более 30 лет назад совсем для других целей.
Думаю, у многих людей, как и у меня, частенько возникала мысль «как бы это всё заменить?». Как убрать садовую тележку и использовать вместо неё нормальный, комфортный и современный электропогрузчик? Кажется, что это совершенно нереально: большая аудитория, уже привыкшая работать с браузерами, которые не могут использовать ничего кроме HTML, огромное количество специалистов с наработанным годами и даже десятилетиями опытом. И главное — отсутствие ответа на вопрос: «а на что менять?!». Преодолеть всю эту инерцию и по сей день кажется невозможным. Однако это не значит, что не стоит и пытаться. С QML я столкнулся очень давно, пожалуй, более 10 лет назад. Его изящество и гибкость мне понравились с самого начала. Да, были моменты, которые в нем несколько озадачивали. Но в то время и QML был несколько другой, и весь фреймворк Qt, на котором он построен, был достаточно сырым. Со временем он развивался и проникал в реальные проекты, и эти проекты, в свою очередь, помогали ему меняться. Сейчас мало кто знает, но на QML реализована масса приложений, как под Windows или Android, так и особенно много под Linux. Во всех этих проектах QML скрыт внутри приложения, поэтому мы зачастую и не догадываемся, что это он. Но пользуемся и это не вызывает у нас проблем, эти приложения работают быстро, стабильно и надёжно.
Ещё раньше я задумался о том, почему Qt до сих пор не выпустил браузер с поддержкой QML, тем более что интеграция Chromium у них уже и так есть. Сейчас мне кажется, что все просто были заняты своими проектами и никому, за исключением отдельных ренегатов, это было не интересно. Тем не менее некоторое количество лет назад я уже задумывался о том, как это можно было бы сделать. Однако гибкость Qt фреймворка на тот момент не позволяла достаточно адаптировать QmlEngine для работы через Web, а у меня не было достаточно опыта и сил в C++, чтобы решить такую задачу. Но не так давно я взглянул на Qt снова и заметил, что задача уже не выглядит неразрешимой. При этом возможно победить и проблему с разграничением доступа из разных вкладок, и реализовать загрузку контента из Web. И вот тогда я взялся за работу. Первый прототип был написан на самом QML. И, эврика, он работал! Для загрузки контента был использован Loader QML Type, а для обычных HTML страниц (чтобы не лишать пользователя привычных сайтов) — QtWebEngine. Всё это вместе чудесно работало, но пока ещё оставались проблемы с безопасностью и контролем над средой со стороны браузера. Вдохновленный первым успехом, тогда я принялся уже за разработку полноценного браузера на C++/Qt.
Самое интересное
Теперь я готов представить вам работающий браузер, который умеет открывать не только HTML, но и QML страницы! Собственно, вот он: https://github.com/Toorion/qml-browser. Сейчас я ещё не рискну утверждать, что именно эта технология заменит давно морально устаревшие DOM + HTML, однако я могу с полной уверенностью заявить, что эра HTML подходит к концу. Нет, HTML не исчезнет как класс, но его заменит если не QML, то язык, более соответствующий принципам SOLID, DRY, YAGNI (шучу), приспособленный к динамическому контенту и взаимодействию с пользователем, а HTML останется для того, для чего его создавали с самого начала — размечать гипертекст. Очень надеюсь, что если QML и не завоюет Web в ближайшем будущем, то хотя бы станет тем первым камешком, который запустит лавину борьбы технологий за будущий Web 3, 4, 5.0. Сейчас тот знаменательный момент, когда вы можете либо примкнуть к этой борьбе, осваивая новые и интересные подходы, либо оказаться заваленными грядущей лавиной.
Теперь немного о самом QmlBrowser
Наверное, если бы я вам просто поведал о новом браузере, пусть даже с более удобным и производительным языком (подробное сравнения QML и HTML можно найти здесь: White paper: Qt vs HTML5 #1 Practical Comparison), вряд ли бы вы всерьёз задумались над тем, чтобы использовать его в своей работе. Поэтому я дополню свой рассказ описанием нескольких фич, которые делает QmlBrowser уникальным, и завершу его описанием того, где уже сейчас этот браузер может вам пригодиться.
Неограниченное лимитами и гарантированное LocalStorage
В QmlBrowser вы можете загружать свои данные без всяких ограничений и полагаться на них не беспокоясь, что они будут постоянно исчезать. В дальнейшем планируется реализовать специальный менеджер, с помощью которого пользователь сможет следить за используемым пространством на диске.
Отсутствие Cookies
Больше вам не придётся спрашивать пользователя «принять» или «не принять» Cookies. Их в режиме QML просто нет (в HTML режиме все остаётся по-прежнему). «И какое же это улучшение?» – спросите вы. Но вернёмся на пункт выше: теперь вы можете хранить всю необходимую информацию в LocalStorage и передавать её на ваш сервер в запросе данных. В режиме QML пользовательский интерфейс и данные полностью отделены друг от друга. Для QML вам нет необходимости создавать страницы сайта на лету, в QML режиме ваш сайт – это аналог SPA в современном JS фреймворке.
Никаких CORS
QML режим в QmlBrowser просто не знает, что это такое. Ему это не нужно, безопасность обеспечивается совершенно иначе. Здесь просто нет возможности сделать HTML (QML) Injection. Возможно, рекламщики будут недовольны, ведь как теперь вставлять свою рекламу (здесь и монетизация будет работать по-другому, об этой большой теме я расскажу в отдельной статье), зато теперь вы можете обращаться к любым сайтам для запроса контента для пользователя, что открывает весьма широкие перспективы для творчества.
Поддержка работы с 3D – beta
QmlBrowser поддерживает работу с 3D на уровне движка. Вам не надо более разделять — сайт на HTML отдельно, а 3D на WebGL отдельно. В QML вы можете работать как с 2D, так и с 3D объектами и обеспечивать их взаимодействие друг с другом. Сейчас это уже отлично работает под Linux, под Windows пока есть нюансы.
SDAPPS (Serverless Decentralized Applications) – очень скоро
Уже совсем скоро QmlBrowser сможет не только заходить на сайты в интернете, но и устанавливать QML приложения из различных источников. Это может быть и репозиторий в git, и архив, расположенный на IPFS сервере. Откроются совершенно новые возможности для децентрализации, которая сейчас весьма условна. Конечно, сейчас много децентрализованных сетей, но какая же это децентрализация, если у всех есть единая точка входа — сервер, через который совершается взаимодействие с пользователем и который может быть взломан и использован злоумышленниками!
И, конечно, это не все, что будет реализовано в QmlBrowser. Вас ждут самые невероятные и неожиданные фичи, которые в перспективе перевернут весь Web! Но, конечно, это будет не сразу. А пока о том...
Как QmlBrowser можно применять уже сейчас
Полагаю, было бы весьма странным призывать вас прямо сейчас создавать QML сайты для широкой аудитории. Аудитория ничего не знает о QmlBrowser и вряд ли сразу кинется его использовать. Однако уже сейчас есть области, где QmlBrowser будет просто незаменим:
ERP решения
Для работы с данными QML подходит как никто другой. В сочетании с LocalStorage это вообще бомба. Вы можете обрабатывать большие формы а‑ля Excel, добавляя к ним онлайн проверки из базы, загружать отчёты пользователю, чтобы он мог гонять различные фильтры и сортировки, не заставляя сервер снова и снова отдавать отчёт частями, способными влезть на страницу браузера. И все это никуда не пропадает, если пользователь случайно нажал F5 или закрыл вкладку. При этом вы можете прямо в приложении запрашивать данные из интернета: курсы валют, макроэкономические показатели и прочее и прочее. Говорю со знанием дела — сам использую этот инструмент в работе.
Агрегаторы данных
Если раньше для агрегации данных необходимо было создавать сайт на сервере, который бы сам собирал данные из различных источников, то в QmlBrowser вы можете создать приложение, делающее это на стороне клиента. И вам уже не придётся придумывать как идентифицироваться от имени пользователя, хранить и обеспечивать безопасность его логинов и паролей и бороться с блокировкой IP вашего сервера, когда вы авторизуетесь на внешнем источнике от имени сразу нескольких пользователей. Например, вы можете сделать приложение, которое агрегирует данные с нескольких криптовалютных бирж и выводит совмещённый график цены и баланса пользователя, при этом пользовательские ключи для доступа к API будут храниться локально, что сразу сделает ваше приложение лидером среди всех известных Trading desk платформ, работающих через обычный браузер. Да и работать оно будет существенно быстрее.
Админки
Если вам нужно реализовать управление сайтом и хочется сделать это одновременно и просто, и функционально, то QmlBRowser теперь — это незаменимый инструмент! На сервере достаточно реализовать REST API, а уже интерфейс управления можно сделать на QML. Можете пока поверить на слово, а затем и убедиться самостоятельно — это будет самая удобная админка, которую вы когда‑либо делали. Да и скорость со стабильностью работы весьма порадуют администраторов, которые будут с ней взаимодействовать.
Конечно, я вряд ли смогу перечислить все доступные уже сейчас области применения QmlBrowser, но надеюсь, что конкретными примерами я показал вам направление мысли и, возможно, вы сами решите, как именно вы можете улучшить себе жизнь при помощи этого мощного инструмента. А я, со своей стороны, всегда буду рад фидбэку и пожеланиям по улучшению. И конечно, всегда буду рад единомышленникам, которые будут как разрабатывать новые инструменты при помощи QmlBrowser, так и непосредственно помогать с разработкой проекта.
Следите за новостями, ведь это только начало!
Телеграм: @QmlBrowser
Twitter (X): Toorion
