Почему вам следует использовать Qt / QML для следующего кроссплатформенного приложения - часть 1

часть 1 - Рабочий стол
часть 2 - Мобильный
часть 3 - ТВ

Моя история разработки программного обеспечения началась около 16 лет назад, когда на языке Паскаль была разработана небольшая консольная 2D-игра.
С тех пор многое изменилось, и сегодня HTML (все еще) продвигается как единственная технология, позволяющая управлять их работой на любой платформе. И хотя я всегда был где-то на этой подножке, я все еще недоволен нынешним состоянием. А пока позвольте представить вам еще одного соперника, которого я активно использую последние 5 лет.

Итак, вы (ну… ваш босс) думаете о новом отличном приложении, которое вы должны опубликовать для настольных компьютеров и на котором основывать свой бизнес. Это еще одно классное приложение для обмена сообщениями. Или, может быть, у вас наконец-то появилась возможность переписать то старое приложение, которое приносит все деньги, но никому не нравится работать над ним, поскольку технический долг слишком велик. Ну, прежде всего, всего наилучшего!

Вы, вероятно, исследовали или даже написали свое приложение, используя некоторые из (HTML) кроссплатформенных фреймворков, и вы не уверены на 100% в том, как это сделать. В конце концов, какой из вариантов выбрать в наши дни?

После использования Qt в течение почти 10 лет я понял, что многие хотели бы попробовать совершенно новый фреймворк, даже не глядя и не зная, что предоставляет Qt.
Итак, сегодня мы собираемся перечислить некоторые причины, по которым вам следует попробовать Qt / QML. для вашей следующей разработки приложения.

О Qt / QML

Итак, что такое QT и что такое QML?

Qt - это кроссплатформенная среда разработки программного обеспечения, используемая для создания встроенных, настольных и мобильных приложений. Он написан на C ++, который реализует широкий спектр различных функций, которые могут вам понадобиться на вашей платформе. Они разрабатываются для каждой платформы с использованием собственных технологий, доступных на этой платформе.
Это означает, что, например, создание приложения для воспроизведения звука с использованием элемента MediaPlayer QML будет использовать Media Foundation в Windows, а GStreamer в Linux (см. Qt Multimedia Backends).

Функциональность и возможности реализованы и разделены в виде модулей, и вы можете найти актуальный список на http://doc.qt.io/qt-5/qtmodules.html.

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

Существует также официальный Qt для python для тех, кто предпочитает другой язык, или посмотрите список привязок, чтобы найти другие https://wiki.qt.io/Language_Bindings.

Модули графического интерфейса

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

Виджеты предоставляют более старый способ написания приложений с графическим интерфейсом пользователя с использованием C ++, в то время как модуль Quick - это новый способ использования языка QML, который мы будем продвигать здесь. Если вы хотите узнать больше, вы можете узнать больше, используя предоставленные ссылки. Но имейте в виду, что нет необходимости знать или касаться модуля Widgets, если вы планируете использовать модуль Quick с QML.

QML - это декларативный язык, который является частью инфраструктуры Qt и модуля Quick и позволяет создавать гибкие и производительные пользовательские интерфейсы. Это декларативный язык, специально разработанный для создания графических пользовательских интерфейсов, которые отображаются каждую минуту его использования. При необходимости его можно легко расширить с помощью остальной части фреймворка Qt. Также встроена поддержка JavaScript, что, учитывая популярность языка, является большим плюсом.

Покажи мне код

Теперь нет ничего лучше, чтобы получить представление об использовании фреймворка, чем увидеть некоторый код.

// app.qml    
import QtQuick 2.10    
import QtQuick.Window 2.10    
import QtQuick.Controls 2.10    
import QtQuick.Layouts 1.1    
    
Window {    
    width: 800    
    height: 600    
    color: "black"    
    
    ColumnLayout {    
        anchors.fill: parent    
    
        Image {    
            id: image    
            source: "https://picsum.photos/800/600"    
            fillMode: Image.PreserveAspectCrop    
            Layout.fillHeight: true    
            Layout.fillWidth: true    
        }    
    
        Button {    
            text: "Quit"    
            Layout.alignment: Qt.AlignHCenter                                                                                                                                                                      
            onClicked: {    
                console.log("hello from Javascript")    
                Qt.quit()    
            }    
        }    
    }    
}

Итак, да, это, вероятно, полностью отличается от того, что вы могли использовать до сих пор, учитывая, что это не существующий язык. (Хотя лично мне об этом напоминает последний Flutter)

Вы можете использовать qmlscene, который является частью Qt (который вы можете легко установить в любом дистрибутиве) для запуска этого кода - если вы получите некоторые ошибки, это значит, что модули не установлены, хотя они у вас установлены. , просто попробуйте уменьшить импортированную версию, так как вы, вероятно, используете более старую версию Qt.

Вы всегда можете загрузить последнюю версию Qt с Qt Creator из официальных репозиториев и собрать ее как подходящее приложение - http://doc.qt.io/qt-5/qtdoc-tutorials-alarms-example.html. С его помощью вы также можете получить все официальные примеры, готовые к сборке и запуску.

Вы хоть представляете, как будет выглядеть приложение, просто прочитав код?

Почему вы должны это использовать

Зрелость

Фреймворк QT существует уже более 20 лет, а сам QML появился почти 10 лет назад. За это время фреймворк прошел немало итераций и постоянно улучшался.

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

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

С другой стороны, нет официального менеджера пакетов / репозитория, который бы заменил то, к чему вы привыкли, например NPM. И с моей точки зрения, это единственное реальное ограничение платформы.
Это означает, что вы, возможно, изобретаете велосипед вместо того, чтобы найти что-то, что можно легко найти в Интернете. Однако это заставит вас знать код, который вы используете, что с точки зрения производительности и безопасности может быть большим плюсом.

Документация и примеры

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

По моему опыту, после почти 10-летнего использования Qt у него есть одна из лучших доступных документов. Покрыта каждая часть фреймворка. Вы открываете документацию и начинаете читать о создании простого приложения QML, и в итоге вы попадаете в объяснение графа сцены QML, в котором рассказывается о цикле рендеринга.

И хотя вы можете найти в документации фрагмент кода, который не предоставляет вам достаточно документации, вы, вероятно, найдете полный пример, относящийся к этой области. Просто взглянув на список примеров, вы увидите, что для каждой области есть что найти http://doc.qt.io/qt-5/qtexamplesandtutorials.html.

С другой стороны, поначалу документация на самом деле огромна. А после того, как вы привыкнете к уровню получаемой информации, вам будет трудно принимать документацию из других фреймворков.

Javascript

Бесспорно, JavaScript - популярный язык, поэтому его встроенная поддержка в QML является очевидным преимуществом, особенно если у вас уже есть люди, которые с ним работают. Это означает, что, вероятно, вся ваша бизнес-логика будет написана на JavaScript, поэтому вы даже сможете повторно использовать существующие библиотеки, если они у вас есть. А если у вас тяжелая логика и JavaScript оказывается слишком медленным, вы всегда можете переписать эту часть на C ++.

Более подробную информацию об использовании Javascript с QML можно найти в официальных документах.

С другой стороны, это может быть не на 100% тот же JavaScript, который вы пишете сегодня, поскольку некоторые части взяты из вашей среды и не являются частью Спецификации языка ECMAScript. О других различиях см. Http://doc.qt.io/qt-5/qtqml-javascript-hostenvironment.html.
Последние стандарты ECMAScript также медленнее переходят в QML, и внешние библиотеки, вероятно, потребуют модификации, прежде чем вы сможете их просто использовать, поскольку они в основном основаны на веб-браузере и среде Node.js.

Простота использования

Сейчас многие фреймворки появляются часто, а некоторые из них существуют уже довольно давно. Но большинство из них используют существующие технологии для разработки пользовательского интерфейса. И хотя это работает, сколько из них было предназначено для разработки пользовательского интерфейса?

По нашему опыту, люди действительно быстро изучают QML, особенно те, кто уже знает JavaScript и некоторые современные UI-фреймворки. Все они согласны, независимо от того, какой фреймворк они использовали ранее, что это более естественный и упрощенный способ написания приложений пользовательского интерфейса. И как только они набирают скорость, они становятся намного более продуктивными, поскольку меньше шаблонов и фреймворк им не мешает.

С другой стороны, разработчиков QML не так много, как разработчиков HTML (выберите свой фреймворк), поэтому для тех, кто плохо знаком с фреймворком, есть ожидаемая кривая обучения.

Производительность

Действительно. В конце концов, Qt написан на C ++ и изначально работает на поддерживаемых платформах. И хотя у нас могут быть долгие дискуссии о том, что фреймворки HTML становятся все более и более производительными, а электрон достаточно хорош при правильном использовании, есть просто дополнительные накладные расходы, которые вы не можете игнорировать.

И если вы действительно хотите пойти по своему пути HTML в будущем, эй, у вас это покрыто Qt WebEngine, который интегрирует движок хрома таким же образом, но при этом предоставляет вам всю платформу Qt под ним, которую вы можете использовать для расширения функциональности.

Кросс-платформенная разработка

Qt официально поддерживает Windows, WinRT (универсальная платформа Windows 10), MacOS, Linux, Android, iOS, tvOS и watchOS. Это означает, что вы можете использовать его для разработки мобильных и настольных приложений или даже игры для Xbox!

Если вы только начинаете с малого и должны поддерживать более одной платформы или планируете поддерживать более одной в будущем, это может быть лучшим способом сделать это. Я работал в компании, где мы использовали его для разработки мобильных приложений для Android / iOS, а также приложений для AndroidTV. По сравнению с компанией, где мы используем разные технологии для каждой платформы, очевидны преимущества.
С помощью одной технологии вы можете делиться знаниями, людьми, языком программирования и даже библиотеками.

С другой стороны, не каждая платформа поддерживает все функции, которые могут вам понадобиться. Или у вас уже есть команды, обладающие опытом работы с каждой платформой, поэтому переключение фреймворков может оказаться сложнее.

QtCreator

Qt поставляется с QtCreator, поскольку это собственная IDE, которую вы можете использовать для разработки Qt / QML, и я лично использую ее. Он имеет отличную интеграцию со всей платформой Qt и упрощает разработку и тестирование на нескольких платформах, поэтому они действительно находятся на расстоянии одного клика.

Отладчик и профилировщик прекрасно интегрированы, поэтому очень легко быстро понять, как ведет себя ваше приложение и где может быть узкое место. Он также предоставляет вам Qt Quick Designer, который вы можете использовать для помощи в разработке, хотя я еще не пробовал это.

С другой стороны, это, вероятно, не та IDE, которую вы сейчас используете и любите. Если вы используете другую IDE, тогда поддержка QML будет сложнее (например, https://github.com/bbenoist/vscode-qml - который охватывает только синтаксис), поэтому вам нужно будет настроить ярлыки для запуска CLI командует собой.

Для тех, кто, как и я, не может переключиться с (neo) VIM, есть также FakeVim для компенсации, хотя на самом деле это не то же самое.

Мобильные платформы?

Qt более чем готов к разработке мобильных приложений, для которых есть отдельная статья!

Веб-платформа?

Мы не можем отрицать одно: нет веб-приложений без HTML. Но прошли те времена, когда вы на самом деле писали простой HTML с помощью Javascript и CSS. Вероятно, вы используете некоторые абстракции, такие как Angular с TypeScript и Sass, который также включает Node.js.
Так есть ли что-то, что могло бы создавать «простой» HTML из приложения QML?

Qt for WebAssembly - это официальная попытка развернуть ваши приложения Qt / QML в сети, очевидно, с использованием webassembly. Хотя сейчас это предварительная версия технологии, это, несомненно, произойдет в будущем.
Обновление: будущее уже здесь!

Существуют также альтернативные подходы, такие как перевод QML в HTML с помощью таких проектов, как PureQML и QMLWeb.

Куда пойти отсюда

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

Но если вы ищете новые варианты, Начало работы с программированием с Qt Quick должно помочь вам. Вы также можете изучить отличную онлайн-книгу: https://qmlbook.github.io.

Оформить заказ часть-2, чтобы увидеть пример кроссплатформенного приложения Todo!

Почему вам следует использовать Qt / QML для следующего кроссплатформенного приложения - часть 1 - рабочий стол