メタタグコードを使用して、360 デュアルコアブラウザを互換モードではなく高速モードにデフォルト設定します。

メタタグコードを使用して、360 デュアルコアブラウザを互換モードではなく高速モードにデフォルト設定します。

あるウェブサイトでは、ユーザーが WebKit カーネルでページを開くことを期待して、HTML5 と CSS3 を多用しています。しかし、テストの結果、360 の推奨モードは IE カーネルで開くことであることがわかりました。理由はわかりません。実際、360 は Web サイト開発者が選択できる方法を設計しました。メタ タグ コードを追加するだけで問題を解決できます。

以下の情報は360公式サイトから抜粋したものです。

ブラウズモード

スピードモード、互換モード、IE9 高速モードは、360 ブラウザが Web ページを表示するときに使用する 3 つのモードです。

高速モードを示します

互換モードを示します

IE9/IE10 モードを示します (IE9 または IE10 がインストールされている場合にのみ使用可能)

360 Speed Browser は、各 Web サイトに適した閲覧モードを自動的に選択します。したがって、通常は複数のカーネルの違いを知る必要はありません。

各モードの特徴は何ですか?

高速モードでは、Web サイトはすぐに開きますが、一部の Web サイトでは互換性の問題があり、高速モードでは異常に表示される場合があります。
互換モードでは、Web サイトの開く速度は超高速モードよりもわずかに遅くなりますが、Web ページの互換性の問題は少なくなります。
IE9/IE10 モードでは、Web サイトは IE9/IE10 のレンダリング方法を使用してレンダリングされ、ハードウェア アクセラレーションと IE9/IE10 の新しいスクリプト レンダリング エンジンをサポートします。

ブラウジング モードを切り替えると、360 Speed Browser は 2 つのコア間でデータを自動的に同期し、2 つのコア間をシームレスに切り替えることができます。

ユーザーエクスペリエンスプログラム

ユーザー エクスペリエンス プログラムにご参加いただくと、互換性リスト ライブラリの改善や製品の改善に役立てるため、切り替えられた URL を 360 Web サイトにお送りします。

アップロードされたデータにはお客様の個人情報は含まれておらず、第三者の個人または組織に開示されることはありません。

切り替えたURLをアップロードしたくない場合は、「詳細オプション」のチェックボックスをオフにするだけです。
「360 スピード ブラウザの改善に役立てるため、使用統計とクラッシュ レポートを 360 スピード ブラウザの Web サイトに自動的に送信します。」

背景

よく知られているように、中国で主流のブラウザはデュアルコアブラウザであり、よく使用される Web サイトを高速に閲覧するための Webkit カーネルに基づいています。 IE ベースのカーネルは、オンライン バンキングや古いバージョンの Web サイトとの互換性のために使用されます。 360 のいくつかのブラウザを例にとると、主流の Web サイトを Webkit カーネルでレンダリングすることを優先し、ページの互換性を確保するために、少数の Web サイトのみを IE カーネルでレンダリングします。長い間、私たちの主な制御手段は、長期にわたる手動操作によって収集された数百 KB の URL ライブラリでした。

当社は、ユーザーからのフィードバックとコードタグのインテリジェントな判断技術を通じて、ブラウザの自動コア切り替えの精度を向上させるために努力しています。しかし、多くの場合、まだ 100% 正確であるとは言えません。そのため、カーネル制御メタタグという新しい制御方法を追加しました。ウェブサイトにメタ タグを追加し、この URL をレンダリングするためにどのカーネルを使用するかを 360 Browser に指示すると、360 Browser はこのタグを読み取った後、すぐに対応するカーネルに切り替えます。そして、この動作をこの第 2 レベル ドメイン名の下にあるすべての URL に適用します。
現在、この機能は 360 セキュア ブラウザすべてに実装されています。他のブラウザベンダーでもこの実装をサポートすることをお勧めします。この制御ラベルを業界標準にしましょう。

コードサンプル

ヘッドタグにコード行を追加します:

XML/HTML コードコンテンツをクリップボードにコピー
  1. <html>   
  2. <ヘッド>   
  3. <メタ 名前= "レンダラー"コンテンツ= "webkit | ie-comp | ie-stand" />   
  4. </ヘッド>   
  5. <本文>   
  6. </本文>   
  7. </html>   

コンテンツの値は、webkit、ie-comp、ie-stand のいずれかで、大文字と小文字が区別され、それぞれ webkit カーネル、IE 互換カーネル、IE 標準カーネルを表します。

ページでデフォルトでスピードカーネルを使用する必要がある場合は、タグを追加します: <meta name=”renderer” content=”webkit” />
ページでデフォルトで IE 互換カーネルを使用する必要がある場合は、タグを追加します: <meta name="renderer" content="ie-comp" />
ページでデフォルトで IE 標準カーネルを使用する必要がある場合は、タグを追加します: <meta name="renderer" content="ie-stand" />

ここで問題が見つかりました。公式情報は「>」で終わっており、実際のテスト時には機能しません。このときは、末尾を「 />」に変更するだけで(/の前にスペースがあることに注意)、テストは実行可能になります。

各レンダリングコアの技術的詳細

カーネルウェブキットIE の互換性IE 標準
ドキュメントモードクローム21 IE6/7 IE9/IE10/IE11 (ユーザーのIEによって異なります)
HTML5サポートはいいいえはい
ActiveX コントロールのサポートいいえはいはい

各カーネルのUAの例



述べる

この機能は、実際には IE9 の X-UA-compatible と非常によく似ています。いくつかの IE コアの実装の概要については、以下を参照してください。
http://blogs.msdn.com/b/ie/archive/2010/06/16/ie-s-compatibility-features-for-site-developers.aspx

スピードモードと互換モードで使用されるテクノロジーについて詳しくは、以下をご覧ください。

エクストリーム スピード モードでは、世界最速のブラウザー カーネルであり、多くの新しい Web 標準をサポートする Webkit カーネルが使用されます。
ただし、Webkit カーネルは比較的新しいため、一部の国内 Web サイトはまだこのカーネルを十分にサポートしていません。

互換モードでは、IE ブラウザで使用される Trident カーネルが使用されます。これは、国内の Web ページを作成するときに互換性のある主要なブラウザ カーネルであり、互換性の問題が少なくなります。

IE9/IE10 モードでは、IE9/IE10 ブラウザーで使用される新しいカーネルが使用され、ハードウェア アクセラレーション、新しいスクリプト レンダリング エンジン、さらに標準的な HMTL5 および CSS3 サポートが追加されます。

<<:  要素フォーム検証で検証プロンプトをクリアする方法

>>:  Docker で Tomcat、MySQL、Redis をインストールするための詳細な手順

推薦する

Grafana+Prometheus を使用して MySQL サービスのパフォーマンスを監視する

Prometheus (プロメテウスとも呼ばれる) 公式サイト: https://prometheu...

Vue+EChartsは、中国の地図の描画と省の自動回転と強調表示を実現します。

目次成果を達成する完全なコード + 詳細なコメントまとめ成果を達成する完全なコード + 詳細なコメン...

MySQL で null を置き換える IFNULL() および COALESCE() 関数の詳細な説明

MySQLではisnull()関数をnull値の代わりとして使用することはできません。次のように:ま...

Vue3 における computed の新しい使用例のまとめ

vue3 での computed の使い方。vue3 は vue2 のオプション API と互換性が...

js で虫眼鏡効果を実現するためのアイデアとコード

この記事の例では、虫眼鏡効果を実現するためのjsの具体的なコードを参考までに共有しています。具体的な...

Dockerカスタムブリッジdocker0とdockerのコマンド操作の開始、終了、再起動

質問会社がサーバーを移行した後、デフォルトで作成された docker0 ブリッジが会社の外部ネットワ...

反応ループデータの実装(リスト)

まず、バックグラウンドから来るデータをシミュレートしてみましょう。ここでは、コードをわかりやすくする...

Meituan DBデータをデータウェアハウスに同期するアーキテクチャと実践

背景データ ウェアハウス モデリングでは、何ら処理されていない元のビジネス レイヤー データは OD...

CSS を使用して画像の色を変更する 100 の方法 (収集する価値あり)

序文「画像処理というと、PhotoShop などの画像処理ツールを思い浮かべることが多いです。フロン...

ハイパーリンクAタグを学ぶ

聞く: CSS を使用してハイパーリンクのスタイルを設定しましたが、ホバーしても機能しません。なぜこ...

mysql8.0.20 のダウンロードとインストールおよび発生した問題 (図とテキスト)

1.ブラウザでmysqlを検索してダウンロードしてインストールしますアドレス: https://d...

一般的なDockerコマンドの概要

Dockerのインストール1. 要件: Linuxカーネルバージョン3.10以上 表示: uname...

Linux で 1 つのファイルの内容を別のファイルの末尾にコピーする

問題の説明:たとえば、ファイル 11 の内容は次のとおりです。こんにちはファイル22の内容は次のとお...

CSS 画面サイズ適応実装例

CSS 画面サイズの適応を実現するには、まず CSS3 @media メディア クエリを導入する必要...

VMware15/16 VMwareのロックを解除してMacOSをインストールする詳細な手順

VMware バージョン: VMware-workstation-full-16 VMware バー...