ホームページ > バックエンド開発 > PHPチュートリアル > js非同期ファイルローダーの詳細説明、js非同期ローディングの詳細説明_PHPチュートリアル

js非同期ファイルローダーの詳細説明、js非同期ローディングの詳細説明_PHPチュートリアル

WBOY
リリース: 2016-07-12 09:00:07
オリジナル
897 人が閲覧しました

js 非同期ファイルローダーの詳細な説明、js 非同期読み込みの詳細な説明

このシナリオはよく遭遇しますが、これらのプラグインは比較的大きいため、パッケージ化には適していません。ページのメイン js に ( cmd メソッドを使用していると仮定すると (js はファイルにパッケージ化されます)、現時点では通常、これらのプラグイン ファイルを非同期で取得し、ダウンロードの完了後に初期化ロジックを完了します。

画像のアップロードを例として、plupload.js プラグインを使用すると、次のように記述します:

リーリー

しかし、通常、ページは複数の独立したモジュール (コンポーネント) で構成されています。ページ上のモジュール A と B の両方が plupload.js に依存している場合、上記のコードを 2 か所に記述する必要がありますか?これを行うと、plupload.js がダウンロードされる前に 2 つのリクエストが開始される可能性があります。これは並行してダウンロードされるため、js ファイルは、最初にダウンロードして 2 回目にキャッシュされたコンテンツを取得するのではなく、繰り返しダウンロードされる可能性があります。

以下の図は、ページの複数のコンポーネントが vue.js に依存している状況を示しています (jquery と vue が混在するシナリオ)。

そのため、実際の使用ではロックが必要です。つまり、スクリプトのロード中に、スクリプトを繰り返しリクエストしないようにする必要があります。プロミスの優れたツールでは、ロードが完了した後、後続のロジックが順番に実行されます。実装は非常に簡単です。

リーリー

次に、vue.js に依存します:

リーリー

リクエストをもう一度見てください:

わかりました、問題はここで解決されたようですが、plupload.js と vue.js の両方に依存するなど、ページに複数のプラグインの依存関係がある場合、上記のコードを再度記述する必要がありますか (なぜそうなるのですか) (これを言った)ように感じますか?これは冗長ではないでしょうか?したがって、複数の非同期ローダーの生成に役立つ非同期ローダー ジェネレーターが必要です。

リーリー

その後、非同期ローダーを生成してウィンドウに割り当てることができます

リーリー

使用時も上記と同じで、これで基本的に問題は解決します。

上記はjs非同期ファイルローダーに関する詳細な内容であり、皆様の学習に役立つことを願っています。

興味があるかもしれない記事:

    JS ファイルを非同期的にロードするための比較的単純なコード
  • js は画像のプリロードを実装します (js は Image オブジェクト属性を完全に操作し、イベント onload は画像を非同期的にロードします)
  • JavaScript の非同期ロードの詳細 (ブラウザーでJavaScript の読み込みメソッド)
  • JavaScript ファイルの同期読み込みと非同期読み込みの原則
  • js の非同期読み込みのための 3 つのソリューション
  • jQuery の遅延オブジェクトを使用して JS ファイルを非同期かつ順次に読み込みます
  • js と css の非同期動的読み込み js コードファイルの
  • javascriptloadScript非同期読み込みスクリプト例の説明

http://www.bkjia.com/PHPjc/1095276.htmlwww.bkjia.comtru​​ehttp://www.bkjia.com/PHPjc/1095276.html技術記事 js 非同期ファイル ローダーの詳細な説明、js 非同期読み込みの詳細な説明 一部のページはサードパーティのプラグインに依存しており、これらのプラグインは比較的大きく、ページにパッケージ化するのには適していません。
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート