ホームページ ウェブフロントエンド フロントエンドQ&A WeChat ミニプログラムは HTML5 ですか?

WeChat ミニプログラムは HTML5 ですか?

Sep 13, 2021 pm 03:39 PM
html5 WeChat アプレット

WeChat ミニ プログラムは HTML5 ではなく、WeChat の独立した開発モデルに基づいており、開発コストと開発サイクルを節約できます。 WeChat ミニ プログラムと HTML5 の違い: 1. 動作環境の違い、2. 開発コストの違い、3. システム レベルの権限の取得の違い、4. 運用環境でのアプリケーションの実行の滑らかさの違い。

WeChat ミニプログラムは HTML5 ですか?

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

HTML の英語の正式名称は Hyper Text Markup Language で、ハイパーテキスト マークアップ言語です。 HTML5 はテクノロジーであり、HTML5 が付属するシェルはブラウザーであり、ミニ プログラムはダウンロードとインストールを必要としない WeChat ベースのアプリケーションです。

「フロントエンド開発」の観点から見ると、WeChat アプレットと HTML5 の間には多くの違いがあります。まとめると、違いは4つあります!

まず、動作環境の違いです。

従来の HTML5 動作環境は Webview を含むブラウザですが、WeChat アプレットの動作環境は完全なブラウザではありません。デバイス。以下の理由により、ここで書く内容は「不完全なブラウザ」であることに注意してください。

HTML5 関連テクノロジ (すべてではありません) は、小規模プログラムの開発プロセスで使用されます。

ミニ プログラムの最終リリースには WeChat のレビューが必要ですが、WeChat は自身のソフトウェアを更新せずにミニ プログラムを独自のソフトウェアに更新できる点は、ReactNative フレームワークを思い出させます。また、一部の開発者は、WeChat アプレット開発ツールのソース コードで React ライブラリと NodeWebkit ライブラリが使用されていることを発見しました。

公式ドキュメントでは、ブラウザでよく使われるウィンドウオブジェクトやドキュメントオブジェクトはスクリプトでは使用できないことが強調されています(これを踏まえ、zepto/jQueryのようなDOMを操作するライブラリは完全に廃止されました)。

したがって、ミニ プログラムの実行環境は、ブラウザ カーネルに基づいて WeChat 開発チームによって完全に再構築された組み込みパーサーである可能性が非常に高いと思います。独自に定義された開発言語標準により、ミニ プログラムのパフォーマンスが向上します。

ただし、WeChat は開発者に開発ツールを提供しており、その開発ツールにはプログラミング、デバッグ、開発環境、公開機能も組み込まれているため、最終的な動作環境についてこれ以上議論する必要はありません。公式に従ってドキュメントを作成するだけです。そして、WeChat チームが開発者に開発ツールを提供するという動きは、Apple が開発者に提供した X-CODE 開発ツールを思い出させます。WeChat の「野心」が明らかであることが想像できます

2 番目の記事、開発コストの違い

ここで質問があります。HTML5 Web 開発要件に直面したとき、何を考慮する必要がありますか?

開発ツール (vscode、sublimtext、Atom など)、フロントエンド フレームワーク (Angular、react、vue、backbone など)、モジュール管理ツール (Webpack、Browserify など) は脇に置きます。 .)、タスク管理ツール (Grunt、Gulp など)、UI ライブラリの選択、インターフェイス呼び出しツール (ajax、Fetch Api など)、ブラウザの互換性などを 1 つずつ考慮する必要があります。 jqery プラグインを使用して H5 を記述するのは簡単ではないため、開発プロセスでも考慮する必要があります。プロジェクトに一致する適切な jquery プラグインを見つけてください。

これらのツールは非常にカスタマイズ可能であり、開発者の開発効率を向上させます。ただし、編集者は、ほとんどの開発者が独自の構成テンプレートを持っているにもかかわらず、プロジェクト開発の構成作業に多くのエネルギーが消費されていると考えています。プロジェクトで使用されるさまざまな外部ライブラリのバージョンの反復とバージョンのアップグレードにかかる長期的なコストは低くはなりません。

そして、WeChat アプレットの開発ニーズに直面したとき、何を考慮する必要があるでしょうか? WeChat チームは開発者ツールと標準化された開発標準を提供しました。フロントエンドの共通 HTML と CSS は、WeChat のカスタマイズされた WXML と WXSS になりました。WXML はすべてカスタム タグですが、公式ドキュメントには明確な使用方法の紹介があります。 WXSS、JSON、および js ファイルの記述方法は若干制限されていますが、全体的には似ています。これらの標準を統一した後は、開発者はプログラムの作成だけに集中すればよいことがわかります。

  • バックエンド インターフェイスを呼び出す必要がある場合は、リクエスト API を呼び出します。

  • アップロードおよびダウンロードが必要な場合は、アップロードおよびダウンロード API を呼び出します。

  • データをキャッシュする必要がある場合は、ローカル ストレージを呼び出します。 API;

  • 地図の導入、コンパスの利用、決済の呼び出し、スキャンコードの呼び出しなどの機能を直接利用可能;

  • UI面についてライブラリを使用すると、フレームワークには当然独自の weui ライブラリ ボーナスが付属します;

そして、これらの API を使用するときは、ブラウザの互換性について心配する必要はなくなります。本番環境では予期せぬ素晴らしいバグが発生しており、WeChat アプレットの開発コストは以前の Web 開発に比べて実際にはるかに低いことがわかります。

記事 3. システム レベルのアクセス許可の取得の違い

HTML5 Web アプリケーションと比較して、WeChat アプレットはネットワーク通信ステータスやデータ キャッシュなど、より多くのシステム アクセス許可を取得できます。これらのシステム レベルのアクセス許可は、WeChat ミニ プログラムとシームレスに接続できます。これが、ネイティブ アプリのスムーズなパフォーマンスを実現すると公式に主張されています。これは、HTML5 Web アプリケーションがよく批判される分野です。ビジネスロジックがシンプルで機能が単一であるため、シナリオは大部分の HTML5 アプリケーションに位置付けられます。

記事 4: 運用環境でのアプリケーションの実行の滑らかさは異なります。

ミニ プログラムと H5 を区別する最も簡単な点は、H5 を開くと実際に Web ページが開き、その Web ページをブラウザーでレンダリングする必要があることです。複雑なビジネス ロジックやリッチ ページに直面した場合インタラクションを実行すると、ページがフリーズします。

WeChat アプレットは WeChat 上で直接実行されるため、ブラウザを介してレンダリングする手順が不要になるため、WeChat でのアプレットの使用は H5 よりもはるかにスムーズになります。初めて開くときの読み込み時間は数秒であることに加えて、ミニ プログラムのさまざまなページ間の切り替えやジャンプのエクスペリエンスはネイティブ アプリに匹敵し、非常にスムーズです。

ミニ プログラムは外部リンクにジャンプできません。H5 には制限がありません。

要約すると、ミニ プログラムには、H5 よりも開発コストが低く、機能が豊富で、ユーザー エクスペリエンスが向上するという利点があります。 (欠点: WeChat には多くの制限があり、多くのことがカスタマイズできません)

上記は、WeChat ミニ プログラムと HTML5 の違いを私がまとめたものです。現在、WeChat の月間アクティブ ユーザー数は 9 億人で、特に WeChat がパブリック アカウントを開始してからは、月間アクティブ ユーザー数も大幅に増加しており、WeChat ミニ プログラムへの非常に便利な入り口となっています。 9 億を基本数字として、WeChat ミニ プログラムの基礎を築きました。

WeChat ミニ プログラムは HTML5 ではなく、WeChat の独立した開発モデルに基づいており、開発コストと開発サイクルを節約できます。

プログラミング関連の知識について詳しくは、プログラミング ビデオをご覧ください。 !

以上がWeChat ミニプログラムは HTML5 ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

HTMLの表の境界線 HTMLの表の境界線 Sep 04, 2024 pm 04:49 PM

HTML の表の境界線に関するガイド。ここでは、HTML でのテーブルの境界線の例を示しながら、テーブル境界線を定義する複数の方法について説明します。

HTML 左マージン HTML 左マージン Sep 04, 2024 pm 04:48 PM

HTML マージン左のガイド。ここでは、HTML margin-left の概要とその例、およびそのコード実装について説明します。

HTML のネストされたテーブル HTML のネストされたテーブル Sep 04, 2024 pm 04:49 PM

これは、HTML でのネストされたテーブルのガイドです。ここでは、テーブル内にテーブルを作成する方法をそれぞれの例とともに説明します。

HTML テーブルのレイアウト HTML テーブルのレイアウト Sep 04, 2024 pm 04:54 PM

HTML テーブル レイアウトのガイド。ここでは、HTML テーブル レイアウトの値と例および出力について詳しく説明します。

HTML入力プレースホルダー HTML入力プレースホルダー Sep 04, 2024 pm 04:54 PM

HTML 入力プレースホルダーのガイド。ここでは、コードと出力とともに HTML 入力プレースホルダーの例について説明します。

HTML 順序付きリスト HTML 順序付きリスト Sep 04, 2024 pm 04:43 PM

HTML 順序付きリストのガイド。ここでは、HTML 順序付きリストと型の導入とその例についても説明します。

HTML 内のテキストの移動 HTML 内のテキストの移動 Sep 04, 2024 pm 04:45 PM

HTML でのテキストの移動に関するガイド。ここでは、概要、マーキー タグが構文でどのように機能するか、および実装例について説明します。

HTML の onclick ボタン HTML の onclick ボタン Sep 04, 2024 pm 04:49 PM

HTML オンクリック ボタンのガイド。ここでは、それらの紹介、動作、例、およびさまざまなイベントでの onclick イベントについてそれぞれ説明します。

See all articles