ホームページ ウェブフロントエンド H5 チュートリアル HTML5 のパフォーマンスはネイティブ アプリのパフォーマンスに劣りません。ビルディング ブロックを使用して HTML5 製品を構築できます。

HTML5 のパフォーマンスはネイティブ アプリのパフォーマンスに劣りません。ビルディング ブロックを使用して HTML5 製品を構築できます。

Nov 23, 2016 am 11:35 AM
html5

おそらく、WeChat モーメントでは、楽しくて興味深い HTML5 ページが、通常の独立したアプリケーションよりもはるかに多くのユーザーの注目を集めることに気づいたでしょう。モバイル アプリケーションがますます増え、プロモーションがますます困難になっているため、製品にも HTML5 ページを含める必要がありますか?

HTML5 のパフォーマンスはネイティブ アプリのパフォーマンスに劣りません。ビルディング ブロックを使用して HTML5 製品を構築できます。

答えが「はい」の場合は、Web コンポーネント、JS プラグイン、およびカスケード スタイル シート (CSS) を使用して、オープン ソースの HTML5 フロントエンド フレームワークである Amaze UI を試すことができます。を使用すると、HTML5 製品をすばやく構築できます。

モバイルデバイスでWebページに頻繁にアクセスするユーザーは、Webページが基本的にメニュー、タイトルバー、画像ギャラリー、コンテンツリスト、分割線などのいくつかの主要な部分に分割できることに気づいたかもしれません。 Amaze UIでは、公式がさまざまなWebコンポーネントを提供しており、ビルディングブロックのようにHTML5製品を構築することもできます。

折りたたみパネル、ヘッダー、フッター、画像カルーセル、タブ、紹介文、段落など、上記の主要な Web コンポーネントに加えて、これらはすべて、開発者が Amaze UI で直接使用できる Web コンポーネントです。 Amaze UI はオープンソース製品であるため、一部のサードパーティ開発者が特殊なコンポーネントを継続的に提供しています。たとえば、地理的な位置に関しては、ユーザーが地図ガイドを必要とする場合は、記事の下に「Baidu Map」コンポーネントを統合し、コメント システムが必要な場合は、「Say more」コンポーネントを使用できます。サービス Web ページではカスタマー サービスが必要な場合があります。その場合、「Meiqia Customer Service」コンポーネントが当然役に立ちます。

もちろん、これらの要素は Web サイトの一部にすぎないと言う開発者もいるかもしれませんが、実際に Web サイトを作成する場合は、さまざまなインタラクティブな効果やテキストのスケジュール スタイルも必要になる場合があります。このとき、Amaze UIのJSコンポーネントとCSSコンポーネントの有用性が明らかになります。

JS コンポーネントを通じて、開発者は、警告ボックス、スムーズなスクロール、読み込み進行状況バー、ポップアップ ボックス、モーダル ウィンドウ、ドロップダウン コンポーネント、ボタン インタラクションなど、一連の UI 拡張効果を得ることができます。 CSS コンポーネントを通じて、開発者はボタン、フォーム、テーブルなどの HTML 要素を直接統合し、バッジ、パンくずリスト、ボタン グループなどのページ コンポーネントを使用できます。

現在、Amaze UI には合計 20 個近くの CSS コンポーネント、10 個の JS コンポーネント、そして 60 近くのテーマを含む 17 個の Web コンポーネントが含まれており、いくつかの外国の Web フロントエンド フレームワークと比較して、Amaze UI はより強力になるとのことです。中国ユーザーのニーズをもっと考慮してください。たとえば、フォント レイアウトの点では、Bootstrap フロントエンド フレームワークは中国語フォントを定義していないため、Web ページの表示効果はシステムやブラウザによって異なる場合があります。ただし、Amaze UI では中国語フォントが定義され、対象となります。国内シェアが比較的高いブラウザは最適化が施されているため、このような事態は回避できます。

HTML5 製品を作ろうとしている企業の皆さんは、Facebook、LinkedIn、その他の大企業が HTML5 アプリからネイティブ アプリに「離脱」している影にまだいるかもしれません。なぜなら、今日でも HTML5 について話している人がいるからです。上記の例も挙げてください。しかし、かつて Chrome チームで働いていたエンジニアの碇シンジ氏は、そもそも Facebook が HTML5 アプリを非常に遅らせた理由は、HTML5 が良くなかったというよりも Facebook 自体に原因があると PingWest に語った。技術的に言えば、HTML5 の欠点は遅いことではなく、拡張できないことだからです。当時、Facebook の HTML アプリはまだ XML を使用しており、その技術はかなり後進的であったと言えます。

HTML5 アプリのパフォーマンスがネイティブ アプリケーションに劣らないことを証明するために、Google の 2 人のエンジニアが特別に Fastbook HTML5 アプリを作成し、Facebook の「欠陥」が HTML5 のせいではないことを示しました。碇シンジ氏によると、HTML5 アプリのパフォーマンスは、今どころか 2 年前にもネイティブ アプリに追いつく可能性があるそうです。

それでは、HTML5 のパフォーマンスはネイティブ アプリに劣らないのに、なぜ私たちが普段目にする高品質な HTML5 アプリがこれほど少ないのか、気になるかもしれません。これについて、Chen Benfeng 氏は、この分野の開発者の技術的蓄積が不足していることが原因であると感じています。

碇シンジ氏も、多くのアプリケーションではネイティブアプリを書くことはほぼ避けられない、もし3Dゲームを書いていてDOM(ドキュメントオブジェクトモデル)を必要としないのであれば、HTMLを使う理由は全くないとも言いました。 JavaScript を使用すると仕事が楽にならないだけでなく、プロジェクトの進捗が悪くなります。ただし、Facebook のようなモバイル アプリケーションは単なるリストであり、HTML5 の範囲を超えるものは何もないため、HTML5 を使用することに慣れるべきであるため、多くの場合、大企業はテクノロジを選択する際の参考値になりません。

そうですね、HTML5 は人々が思っているほど弱くないと説明すると、Amaze UI のこれらのコンポーネントでは必要な製品を作るのに十分ではないと感じるかもしれません。これが、Amaze UI がオープンソースであることを選択する理由の 1 つです。コミュニティはより多くのコンテンツをそれに貢献します。現在 HTML5 製品の作成を計画している場合は、Amaze UI フレームワークを選択しない場合でも、Facebook や LinkedIn のようなケースが邪魔にならないようにしてください。


このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、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