JavaScript でデスクトッププログラムを作成できますか?-フロントエンドQ&A-php.cn

JavaScript はデスクトッププログラムを作成できます。 JavaScript では、Electron ソフトウェアフレームワークを使用してデスクトッププログラムを開発できます。Electron は、クロスプラットフォームデスクトップアプリケーションを構築するためのオープンソースライブラリです。豊富なローカル API が提供されているため、開発者は純粋な JS を使用してデスクトップアプリケーションを作成できます。

JavaScript でデスクトッププログラムを作成できますか?

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

#デスクトップアプリケーションとは

JavaScript でデスクトッププログラムを作成できますか?

##デスクトップアプリケーション。GUI プログラム (グラフィカル) とも呼ばれます。ユーザーインターフェイス) ですが、GUI プログラムとはいくつかの違いがあります。デスクトップアプリケーションは、GUI プログラムを GUI から「デスクトップ」に変換し、木のようなコンピューターの冷たい概念をより人間的で、より鮮やかでダイナミックなものにします。

それでは、JavaScript でデスクトッププログラムを作成できるのでしょうか?

#JavaScript はデスクトッププログラムを作成できます。

JavaScript の世界はますます強力になっており、Eletron などのフレームワークを使用してデスクトップアプリケーションを簡単に開発できます。 Electron は、クロスプラットフォーム JavaScript デスクトップ開発ライブラリです。

Electron は、Github によって開発されたオープンソースライブラリで、HTML、CSS、JavaScript を使用してクロスプラットフォームデスクトップアプリケーションを構築します。 Electron は、Chromium と Node.js を同じランタイム環境にマージし、Mac、Windows、および Linux システム用のアプリとしてパッケージ化することでこれを実現します。

Electron は、純粋な JavaScript を使用してデスクトップアプリケーションを作成できる豊富なネイティブ (オペレーティングシステム) API を提供します。他のさまざまな Node.js ランタイムとは異なり、Electron は Web サーバーではなくデスクトップアプリケーションに重点を置いています。

Electron を使用すると、純粋な JavaScript を使用して豊富なネイティブ API を呼び出し、デスクトップアプリケーションを作成できます。これは、Web サーバーではなくデスクトップアプリケーションに焦点を当てた io.js の変種と考えることができます。

Electron を開発に使用する理由:

#既存の Web アプリケーション上で直接拡張して、ブラウザーにはない機能を提供できます
#あなたはフロントエンドです
もちろん、その欠点も認識する必要があります。パフォーマンスはネイティブデスクトップアプリケーションよりも低く、最終的にパッケージ化されたアプリケーションはネイティブアプリケーションよりもはるかに大きくなります。

開発経験

互換性

あなたはまだ WEB テクノロジーを使用して開発を行っていますが、あなたは互換性の問題を考慮する必要はなくなりました。現在使用している Chrome のバージョンのみを気にする必要があります。一般的に、最新の API と構文を使用できるほど新しいものです。Chrome のバージョンを手動でアップグレードすることもできます。。同様に、さまざまなブラウザーでのスタイルやコードの互換性の問題を心配する必要もありません。

ノード環境

これは、多くのフロントエンド開発者が夢見てきた機能かもしれません。Web インターフェイスで Node.js が提供する強力な API を使用することは、次のことを意味します。 WEBページ上でファイルを直接操作したり、システムAPIを呼び出したり、データベースを操作したりすることができます。もちろん、完全な Node API に加えて、何十万もの追加の npm モジュールを使用することもできます。

クロスドメイン

Node が提供するリクエストモジュールを直接使用してネットワークリクエストを行うことができるため、クロスドメインに悩まされる必要がなくなりました。

強力なスケーラビリティ

node-ffi を使用して、アプリケーションに強力なスケーラビリティを提供します (後の章で詳しく説明します)。

#Electron を使用しているのは誰ですか

Electron を使用したアプリケーションはすでに市場に多数あります

Electron

は、おなじみの JavaScript でデスクトッププログラムを作成できますか? VS Code

クライアント、

GitHub クライアント、Atom クライアントなどを含めて開発されています。昨年 Xunlei X10.1 をリリースしたとき、私は Xunlei のコピーライティングに非常に感銘を受けました: Xunlei から始める新しいフレームワークを使用した Thunder X は、2K や 4K などの高精細ディスプレイを完全にサポートすることができ、インターフェース内のテキストレンダリングもより鮮明で鮮明になります。技術的な観点から見ると、新しいフレームワークはインターフェイスの描画とイベント処理の点で古いフレームワークよりも柔軟で効率的であるため、インターフェイスの滑らかさも旧フレームワークの Thunder よりも大幅に向上しています。具体的な改善点については？一度試してみればわかります。

VS Code
を開いて [ヘルプ] [開発者ツールの切り替え] をクリックして、
VS Code

クライアントインターフェイスをデバッグできます。

<h2 data-id="heading-9">Electron の動作原理</h2> <p><img src="https://img.php.cn/upload/image/694/630/660/164845834694304JavaScript%20%E3%81%A7%E3%83%87%E3%82%B9%E3%82%AF%E3%83%88%E3%83%83%E3%83%97%20%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%A0%E3%82%92%E4%BD%9C%E6%88%90%E3%81%A7%E3%81%8D%E3%81%BE%E3%81%99%E3%81%8B?" title="164845834694304JavaScript でデスクトッププログラムを作成できますか?" alt="JavaScript でデスクトッププログラムを作成できますか?"></p> <p><code>Electron は、Chromium、Node.js、 を組み合わせたものです。オペレーティングシステムのネイティブ関数を呼び出す API。

1. Chromium

Chromium は、Chrome ブラウザ ## を開発するために Google によって立ち上げられたオープンソースプロジェクトです。 # Chromium は、Chrome のエンジニアリングバージョンまたは実験版に相当します。新機能は最初に Chromium に実装され、その後 Chrome に適用されます。したがって、Chrome の機能は比較的古いものですが、より安定しています。

Chromium は、Electron に強力な UI 機能を提供し、互換性を考慮せずにインターフェイスを開発できるようにします。

2. Node.js

Node.js は、サーバー側 Node で JavaScript を実行できる開発プラットフォームです。 イベント駆動型のノンブロッキング I/O モデルを使用して軽量かつ効率的です。 Chromium

だけではネイティブ

GUI を直接操作する機能を持たないため、Electron は Nodejs を統合することでこれを可能にしますインターフェイスを開発すると同時に、オペレーティングシステムの基盤となる API を使用することもできます。Path、fs、Crypto および Nodejs## で一般的に使用されるその他のモジュール# は Electron にあり、直接使用できます。 3. システム APIネイティブシステムに

GUI

サポートを提供するために、

Electron

にはネイティブアプリケーションプログラムインターフェイスが組み込まれています。一部のシステム関数の呼び出しシステム通知の呼び出しとシステムフォルダーを開くためのサポートを提供します。開発モードでは、Electron は呼び出しシステム

API

および描画インターフェイスとは別に開発されます。工程が分かれています。 4. メインプロセスElectron は、メインプロセスとレンダリングプロセスの 2 つのプロセスを区別し、それぞれが独自の機能を担当します。

Electron

package.json JavaScript でデスクトッププログラムを作成できますか? の

main

スクリプトを実行するプロセスをメインプロセスと呼びます。 Electron アプリケーションには、常に 1 つだけのメインプロセスがあります。 責任:

レンダリングプロセスの作成 (複数可)

アプリケーションのライフサイクルの制御 (開始、終了APP)

そして、

)
システムの基礎となる関数を呼び出し、ネイティブリソースを呼び出します呼び出し可能な API:

Node.js API

が提供するメインプロセス API (一部のシステムを含む)関数と
追加関数)5. レンダリングプロセス Electron は表示に

を使用するため

web

ページでは、

Chromium のマルチプロセスアーキテクチャも使用されます。 Electron の各 web ページは、独自のレンダリングプロセスで実行されます。 メインプロセスは、BrowserWindow インスタンスを使用してページを作成します。各 BrowserWindow インスタンスは、独自のレンダリングプロセスでページを実行します。 BrowserWindow インスタンスが破棄されると、対応するレンダリングプロセスも終了します。 レンダリングプロセスはブラウザウィンドウとして考えることができます。ブラウザウィンドウは複数存在し、互いに独立して存在できますが、ブラウザとは異なり、Node API

を呼び出すことができます。