多个谷歌地图降低了WordPress管理速度

Question

我使用WordPress的ACF插件来创建一个中继器字段。中继器字段允许管理员向Google Map添加多个标记。

​

​

当我们最初构建这个站点时，它被设计为可以处理大约20个标记。自那以后，客户已经添加了150多个标记。这意味着在后端加载了150个Google Maps实例，这会降低运行速度。

有没有办法为每个字段实现一个异步的Google Map？

Answer 1

当浏览器解析传统的脚本标记时，它必须等待脚本下载、解析和执行，然后才能呈现它后面的任何HTML。然而，使用异步脚本，浏览器可以继续解析和呈现同步脚本之后的HTML，而无需等待该脚本完成。当一个脚本被异步加载时，它会被尽快获取，但是它的执行会被推迟，直到浏览器的UI线程不再忙于做其他事情，比如渲染网页。

另一个技巧是maps.googleapis.com/maps/api/js上的javascript文件是动态的。服务器用不同的js文件响应不同的参数。

function getScript(src) {
document.write('<' + 'script src="' + src + '"' +
' type="text/javascript"><' + '/script>');
}

同步加载脚本时，浏览器将等待它完全加载，而当脚本调用document.write时，文本将附加到要加载的文档中。但是，一旦文档完全加载，就会进行异步调用。当您使用"callback=initialize“加载js时，自执行函数已经包含了初始化的回调，以及一个可以异步加载更多脚本的修改后的函数。

找到了这个相关的标签，讨论如何异步加载谷歌地图：Loading google maps asynchronously