Question

我正在使用Google Maps API在特定网页上显示地图。

问题是文件http://maps.google.com/maps?file=api.....有时会加载非常慢 - 降低页面的性能，因为其余的JavaScript首先加载到文档就绪，很少到达 - 因为浏览器锁定等待来自Google的文件。

我尝试将JavaScript文件从<head>标记移到我的内容下。但其余的JavaScript从未被解雇，因为浏览器会等待来自Google的文件。

有没有解决方法，或者有其他人遇到过同样的问题？它最近开始，我不明白为什么。

这是我的代码，如果有人有兴趣：

<script type="text/javascript" src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=true&amp;key=ABQIAAAAa24xicak8_ghHX58i7La7hRFh9iM79SNC94rOejOtdMRvQmJiBS6Uv5F_1BNSh9ZuSzFXyekHISgew">    </script>
<script type="text/javascript" src="/js/maps.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
    // Google Maps
    initialize();

    // Other JavaScript comes here....

   });
</script>

如果我访问

http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=true&amp;key=ABQIAAAAa24xicak8_ghHX58i7La7hRFh9iM79SNC94rOejOtdMRvQmJiBS6Uv5F_1BNSh9ZuSzFXyekHISgew

文件立即加载。

Answer 1

现在这是一个相当古老的问题 - 解决方案是禁用萤火虫（至少对我而言）。

Answer 2

使用Google的Ajax API。从过去一段时间起，Google的所有服务都可以通过JavaScript API访问。它是一个模块化系统，您只需要包含JSAPI库，然后就可以动态加载所需的模块 - 它不会阻止您的站点。

<script type="text/javascript"        
        src="http://www.google.com/jsapi?key=ABCDEFG"></script>
<script type="text/javascript">
google.load("maps", "2");
google.setOnLoadCallback(function() {
    // Your logic goes here.
    // It will be run right after the maps module was loaded.
});
</script>

有关详细信息，请参阅JSAPI's developer documentation。

Answer 3

关于JavaScript优化：始终将您的JS放在偶数Maps API脚本的底部。我无法想到任何有理由担任任何JS的理由。

谷歌地图API - 慢加载JavaScript

3 个答案: