JavaScript-使用google jsapi的js的时候,如何实现延迟加载呢?

服务器管理 服务器管理 主题:1035 回复:2217

JavaScript-使用google jsapi的js的时候,如何实现延迟加载呢?

偏爱自由 发布于 2017-07-19 字数 153 浏览 996 回复 3

虽然Google的服务器访问速度很快,但如果每个页面都增加google jsapi的js调用,肯定会降低网页打开速度,是否可以等到网页打开以后,再加载google jsapi呢?

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

支持 Markdown 语法,需要帮助?

评论(3

晚风撩人 2017-09-17 3 楼

也许你可以这样
$(document).ready(function () {

google.load("visualization", "1", { packages: ["corechart"] });
});
至少我是这样处理的!

甜柠檬 2017-09-16 2 楼

1.对传输的http流进行压缩,用gzip压缩就可以了,这样压缩后,大小会明显减少,加载的速度也有很明显的提高
2.善用浏览器的缓存,不要禁止缓存,或者失效时间过短
暂时先想到这2个方法

偏爱自由 2017-09-03 1 楼

我们可以用Javascript来动态加载Google JSAPI,参考以下示例程序

function mapsLoaded() {
var map = new google.maps.Map2(document.getElementById("map"));
map.setCenter(new google.maps.LatLng(37.4419, -122.1419), 13);
}

function loadMaps() {
google.load("maps", "2", {"callback" : mapsLoaded});
}

function initLoader() {
var script = document.createElement("script");
script.src = "http://www.google.com/jsapi?key=ABCDEFG&callback=loadMaps";
script.type = "text/javascript";
document.getElementsByTagName("head")[0].appendChild(script);
}

以上代码有2处关键点:
1:加载google jsapi的时候,需要附加参数callback=loadMaps,表示api加载完成以后,google需要回调的函数。注意,仅仅加载了api,还不能使用google的具体的功能,需要使用google.load函数加载具体的模块才行。
2:当使用google.load的时候,需要增加callback参数,否则网页可能会直接跳转到空白页。这里的callback参数是指加载完指定的模块以后要回调的函数。