>_ DevTrendsja

言語

ホーム

言語

セクション

フロントエンド バックエンド モバイル DevOps AI / ML ゲーム開発 ブロックチェーン 組み込み セキュリティ
C

Electronも苦労もない、5分でHTMLにGUIを起動する方法

状況を想像してみてください:C++、Go、Pythonで素晴らしいツールを書きました。高速で正確に計算しますが、ターミナルから使うのはあなただけです。クライアントや同僚が「普通のインターフェース」を求めてきます。そしてここから頭痛が始まります。Qtをインストール?重くて学ぶのに長い。Electronで書く?ボタンを数個のために何百メガバイトものChromiumとNode.jsを持ち歩くことになります。

最近、WebUIを見つけました。これは問題をエレガントに解決する小さなCライブラリです:システムにインストールされている任意のブラウザをグラフィカルインターフェースに変えてくれます。余分な依存関係や巨大なバイナリなしで。

Logo

ここでのコツは何か

WebUIの主なアイデアは、ブラウザはすでに готовый、完璧に最適化されたGUIエンジンだという点です。すべてのユーザーがすでに持っています。あなたのアプリケーションの中に別のChromeインスタンスをパッケージ化するのではなく、 이미 설치되어 있는ものに接続すればいいのはなぜでしょうか?

WebUIはTauriとは異なり、システムWebViewコンポーネントを弄ることを強制しません(そのようなオプションも存在しますが)。ライブラリは単にアプリケーションモードでブラウザセッションを起動し、WebSocket経由で高速な通信チャネルを組織します。

Diagram

内部では何があるか

ライブラリはわずか数キロバイトです。既存のプロジェクトに簡単に統合できる単一のヘッダーファイルです。注目に値するのは以下の点です:

  • クロスプラットフォーム。Windows、Linux、macOSで同様に予測可能に動作します。
  • すべての一般的なブラウザをサポート。Chrome、Firefox、Edge、さらにはYandex.Browserも「オンザフライ」で選択されます。
  • プライベートプロファイル。プログラムはブラウザのユーザーの個人データとアプリケーションのCookieを混在させません。
  • 移植性。プロジェクトのビルドに重いSDKをインストールする必要がありません。

コードではどのように見えるか

古典的な「Hello World」を見てみましょう。Cではスクリプトのように見えます。魔法やコードのダンプはありません:

#include "webui.h"

int main() {
    size_t window = webui_new_window();
    webui_show(window, "<html><script src=\"webui.js\"></script> Hello World! </html>");
    webui_wait();
    return 0;
}

そして、、すべてが便利なオブジェクトに包まれたC++の例です:

#include "webui.hpp"

int main() {
    webui::window my_window;
    my_window.show("<html><script src=\"webui.js\"></script> Привет из C++! </html>");
    webui::wait();
    return 0;
}

ほんの数行で、HTML/CSSコンテンツを含む本格的なウィンドウが手に入ります。同時に、バックエンドはPython、Rust、Go、さらにはPascalなど、お気に入りの言語のままです。

重量クラスの比較

開発者がGitHubに素晴らしいテーブルを提供してくれました。そこにはWebUIがミニマリズムである理由が明確に示されています。Electronがパッケージ内にChromiumとNode.jsを必要とするなら、WebUIはシステム内のブラウザ以外何も必要としません。これによりRAMとディスク容量を節約できます。Tauriのような最新のWebViewソリューションでさえ、LinuxではGTKやWebKitGTKのような依存関係を引っ張りますが、WebUIは単にブラウザウィンドウを開きます。

誰がいつこれが役立つか

もちろん、WebUIはマイクロ秒の応答性が重要なインターフェース用の複雑なプロフェッショナルツールの代わりにはなりません。しかし、命を救うような状況はたくさんあります。

会社のための小さな内部ユーティリティを作成している場合、WebUIはBootstrapやTailwindで一晩でインターフェースを組み上げるのに役立ちます。プロトタイピングには、これは practically 理想的なオプションです:バックエンドロジックに集中し、フロントエンドは通常のウェブサイトのように描画されます。

興味深いポイント — SSL/TLSサポート。アプリケーションを安全にする必要がある場合、WebUIはビルド時のシンプルなフラグでOpenSSLサポートを有効にできます。

まとめ

WebUIは、重いGUIフレームワークに疲倦した人々に新鮮な風です。プロジェクトは積極的に開発中で、GitHubで4000以上のスターを獲得し、さまざまなプログラミング言語用のラッパーがたくさんあります。

試す価値があるケース:

  • 高速で美しいGUIが必要だが、Qtを学ぶ時間がない。
  • バイナリサイズを何百メガバイトにも膨らませたくない。
  • フロントエンド開発者はHTML/JSを知っていて、あなたはシステムプログラミングを知っている。

高負荷のゲームにはおすすめしませんが、システムユーティリティ、ダッシュボード、設定ツールには практически 理想的な選択です。webui.meの公式ドキュメントから始めることができます。すべてそこで説明されています。

関連プロジェクト