LSストレージクラスライブラリ
5376 ワード
モバイルエンドネットワーク環境の不安定性を考慮して、ネットワーク遅延(network latency)を回避するために、ほとんどのウェブサイトのモバイルエンドサイトは、膨大なクラスライブラリをローカルブラウザのLSに格納します.
簡単なコードでjQueryの正確なロードを保証します.このコードを見てみましょう.コードの詳細はコメントに書かれています.
関数呼び出し
ブラウザの静的リソースのロードは並列であり、ネットワークの不安定性がオンラインの安定性に大きく影響するため、オンライン上のいくつかの不思議なライブラリの導入に失敗したエラーを確保できます.
簡単なコードでjQueryの正確なロードを保証します.このコードを見てみましょう.コードの詳細はコメントに書かれています.
!function (globals, document) {
var storagePrefix = "mbox_";
globals.LocalJs = {
require: function (file, callback) {
/*
localstorage, document.write
fallback, document.write
*/
if (!localStorage.getItem(storagePrefix + "jq")) {
document.write(''" type="text/javascript"> ');
var self = this;
/*
3s , jquery , localstorage ( _loadjs )
“ ” ,
3s ? document.write jQuery 。 3s
document.write , , 3s
*/
setTimeout(function () {
self._loadJs(file, callback)
}, 3e3)
} else {
// localstorage,
this._reject(localStorage.getItem(storagePrefix + "jq"), callback)
}
},
_loadJs: function (file, callback) {
if (!file) {
return false
}
var self = this;
var xhr = new XMLHttpRequest;
xhr.open("GET", file);
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
localStorage.setItem(storagePrefix + "jq", xhr.responseText)
} else {}
}
};
xhr.send()
},
_reject: function (data, callback) {
var el = document.createElement("script");
el.type = "text/javascript";
/*
LS ,
1. eval
2. new Function
3. script , script
,
jsperf , 。
*/
el.appendChild(document.createTextNode(data));
document.getElementsByTagName("head")[0].appendChild(el);
callback && callback()
},
isSupport: function () {
return window.localStorage
}
}
}(window, document);
関数呼び出し
!function () {
var url = _GET_HASHMAP ? _GET_HASHMAP("/player/static/js/naga/common/jquery-1.7.2.js") : "/player/static/js/naga/common/jquery-1.7.2.js";
url = url.replace(/^\/\/mu[0-9]*\.bdstatic\.com/g, "");
LocalJs.require(url, function () {})
}();
ブラウザの静的リソースのロードは並列であり、ネットワークの不安定性がオンラインの安定性に大きく影響するため、オンライン上のいくつかの不思議なライブラリの導入に失敗したエラーを確保できます.