时间戳

首页 > 解决方案 > GTM 真的异步加载所有标签吗？

javascript - GTM 真的异步加载所有标签吗？

问题描述

谷歌标签管理器的一大好处和功能来自他们的网站：

异步触发代码，因此它们彼此独立加载，不会减慢您的网页速度。

考虑这种类型的同步标签用法：

<script type="text/javascript" src="www.example.com/third-party-tag.js"></script>
<script type="text/javascript">
   //run some function from third-party-tag.js
</script>

外部js必须同步加载，否则第二个脚本通常会失败。如果您将其直接放入页面 HTML（无 GTM）中，则 js 会同步加载，并且第二个脚本可以工作。

如果您将两个脚本标签都添加到 GTM 中的一个自定义 HTML 标签中，它仍然可以工作。我可以看到没有添加任何“异步”属性。这怎么可能...

  1. 这是一个简单而明显的答案：谷歌标签管理器没有像它声称的那样异步加载外部 js 脚本？
  2. 我是否误解了 GTM 的说法是什么意思？例如，自定义 HTML 片段（标签）的检索和准备是异步的，但是一旦将 HTML 添加到 DOM，所有常规规则都适用于这些标签。

感谢您的任何建议！ps 将代码段重构为“更好”的方法不在问题的范围内。

标签： javascriptasynchronousgoogle-tag-managerweb-performance

解决方案

需要注意的是，仅仅因为脚本是异步加载的，它仍然会阻塞主线程。所有 async 所做的只是指示浏览器在下载脚本时不阻止下载其他请求。这里有一个很好的解释，

https://www.digitalocean.com/community/tutorials/html-defer-async

使用异步，文件被异步下载，然后在下载后立即执行。

使用 defer，文件被异步下载，但仅在文档解析完成时执行。

如果可能，我更喜欢“推迟”脚本。

推荐阅读