1

グーグルマップを使うときはその実装に興味があるので、firebugを使って調べています。

次に、JavaScript の読み込み戦略がかなり興味深いことがわかりました。たとえば、次のページをご覧ください。

オーバーレイの例

次に、このページを初めて開くと、次の js が読み込まれます。

https://maps.googleapis.com/maps/api/js?sensor=false
https://maps.gstatic.com/intl/en_us/mapfiles/api-3/9/13b/main.js
https://maps.gstatic.com/cat_js/intl/en_us/mapfiles/api-3/9/13b/%7Bcommon,map,util,poly%7D.js
https://maps.gstatic.com/cat_js/intl/en_us/mapfiles/api-3/9/13b/%7Bonion,geometry%7D.js

しかし、ページを更新すると (ctrl+f5 を使用)、次の js が読み込まれます。

https://maps.googleapis.com/maps/api/js?sensor=false
https://maps.gstatic.com/intl/en_us/mapfiles/api-3/9/13b/main.js

ただし、ページは引き続き機能し、オーバーレイはマップに描画されます。しかし、poly.js などはどこにありますか?

また、コンポーネントごとに js をロードする方法を教えてもらえますか? たとえばcommon util poly、例の 。

さまざまなコンポーネントを作成する際に知っておくべきことは何ですか?

4

2 に答える 2

2

1. poly.js が読み込まれると、文字列が に渡されgoogle.maps.__gjsload___ます。

ここに抜粋があります：

google.maps.__gjsload__('common', '\'use strict\';var Ai=isNa...

ファイルの残りの部分は、その文字列の内容だけです。

私の推測では、この関数はおそらくこの文字列をlocalStorageまたはに格納sessionStorageするので、一度だけ取得する必要があります。

2.また、必要に応じて js ファイルをロードする方法について知りたい場合は、AMDおよび/または CommonJS: Modulesを参照してください。

AMD の優れた実装 (私の好み) はRequireJSです。

アップデート

私はいくつかのことを調べましたが、このページでは使用されlocalStorageてsessionStorageいないようです. また、結果を複製することもできません。Firebug では、常に poly.js が読み込まれます。どこかで魔法が起こっているのかもしれませんが、私にはわかりません。

ただし、追加の js 呼び出しを行わなくても、文字列を格納して取得することは完全に可能localStorageです。sessionStorage

于 2012-09-08T06:35:42.587 に答える
0

また、コンポーネントごとにjsをロードする方法を教えてもらえますか?

これは、非同期の JavaScript ファイルの読み込みのトピックに触れています。スクリプト内の任意の場所にファイルを「含める」方法を持つ言語を使用したことがある場合は、javascript にこの機能がないことを理解するでしょう。そのため、スクリプト タグ インジェクションによる「aysnc javascript の追加」というパラダイム全体が存在します。

スクリプト タグ インジェクション: スクリプト タグを動的に作成し、そのソースを必要なファイルに設定し、そのタグを DOM に挿入すると、新しいファイルが読み込まれて実行されます。JavaScript を多用するアプリケーションでは、これは一般的であり、特にサード パーティのアプリケーションをロードする場合に顕著です。Google は常にそれを行っています。Google アナリティクスのインクルード スクリプトを参照してください。これの良い例です。

さて、これは扱いが難しくデリケートなタイプのコーディングであるため、一部の「javascript コンポーネント / モジュール / アセットの読み込み」フレームワークはそれを改良し、かなり安定させました。common.js、require.js などはすべて、この点でうまく機能しています。

さまざまなコンポーネントを作成する際に知っておくべきことは何ですか?

Google マップで何をしているのかについては、あまり詳しく知る必要はありません。しかし、JavaScript モジュール パターンの開発に取りかかる場合は、次のことを知っておく必要があります。グローバル名前空間が独自の変数によって乱雑にならないように保護し、可能な場合はすべての作業をクロージャーにカプセル化し、(推奨されますが必須ではありません) 開始します。すべてに aを付け;て、順不同でロードされた場合に互いに壊れないようにします。

于 2012-09-08T06:50:16.853 に答える