使用Google的Platform.js插件

Question

我的网站似乎很慢。出于这个原因，我决定潜入并研究提高性能的方法。在服务器端，一切看起来都不错。但是在客户端，有很多JavaScript会减慢速度。当我看着负载堆栈时，我发现了两个罪魁祸首。

两个最严重的罪犯是https://apis.google.com/js/platform.js和https://www.google-analytics.com/analytics.js。我使用前者用于+1按钮，后者用于分析目的。截至目前，我正在加载它们：

<script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

    ga('create', '[MyId]', 'auto');
    ga('send', 'pageview');
</script>

<script src="https://apis.google.com/js/platform.js" async defer></script> 

我认为platform.js包括Google Plus和Google Analytics。所以，我想我可以使用类似的东西压缩到一个外部JS库：

(function(w,d,s,g,js,fs){
  g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(f){this.q.push(f);}};
  js=d.createElement(s);fs=d.getElementsByTagName(s)[0];
  js.src='https://apis.google.com/js/platform.js';
  fs.parentNode.insertBefore(js,fs);
  js.onload=function(){
    g.load('analytics');
  };
}(window,document,'script'));

这至少会加载Google Plus插件。但是，它实际上不再记录访问。看起来g.load带来了Analytics。但是，我的ID没有被分配到任何地方。同时，我没有看到在platform.js版本中分配它的位置。

任何人都可以提供任何见解吗？如果可能的话，我希望能够少加载一个外部资源。

谢谢。

Answer 1

  

我认为platform.js包括Google Plus和Google Analytics。

不，这不是真的。 platform.js允许您加载Google AnalyticsAPI客户端库（用于以编程方式报告您的GA数据），但这与analytics.js（用于将跟踪数据发送到GA）不同。

根据您显示的代码，这两个库都是异常加载的，因此它们不应该干扰您网站的加载时间。它们可能会在window.load事件触发时放慢速度，但这并不意味着您的网站加载速度较慢，因为它不会影响应用关键资源的加载。

如果确实希望加载这些库而不会影响任何负载指标，则可以推迟加载它们直到window.load事件触发后，但说实话我只是如果您有其他代码等待window.load触发初始化，请执行此操作。

Answer 2

如果analytics.js包含在platform.js中，这可能有用吗？

(function(w,d,s,g,js,fs){
  g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(f){this.q.push(f);}};
  js=d.createElement(s);fs=d.getElementsByTagName(s)[0];
  js.src='https://apis.google.com/js/platform.js';
  fs.parentNode.insertBefore(js,fs);
  js.onload=function(){
    g.load('analytics');
  };
  ga('create', '[MyId]', 'auto');
  ga('send', 'pageview');
}(window,document,'script'));

Answer 3

很难理解为什么这两个库会减慢页面速度，它们通常使用异步技术（和）

平台的重量不到20 Kbs，通常这个库托管在CDN中，所以也许你的主机不是那么胖，而欧洲（测试的那个），但我可以放弃这个选项，因为美国和拉美服务器是也很好。

我已经阅读了platform.js并且与analytics.js没有共同点，为什么你认为它包含在内？也许Google Analytics包含在Iframe或其他资源中会让您感到困惑，但如果您没有正确使用该命令（＆＃39;创建＆＃39;），则不会向您的帐户发送任何信息。也许你仍然有图书馆，但信息被发送到另一个帐户（当嵌入一些iframe时，这种情况会发生很多，它们包括Google Analytics但在不同的域中，并且数据被发送到2个不同的帐户，这可能很难一开始就明白了。

但是，如果我理解的话，仍然是你的主要怀疑。

你想为两者保留一个库，我认为这是不可能做到的。我检查了platform.js，没有引用Ga对象（Google Analytics上使用的对象），甚至没有引用收集URL（将信息发送到Google Analytics）。 GA主要Snippet还做了一些额外的事情，比如保留稍后使用的执行日期。

我能推荐你什么？

1.-查看点击次数，使用网络控制台，如果您没有使用SSL，则会通过HTTP强制拨打HTTPS，将Google分析点击发送到http://www.google-analytics.com（您有两次点击，但分析只会使用安全的分析。或使用Tag Assitant查看此内容。 https://chrome.google.com/webstore/detail/tag-assistant-by-google/kejbdjndbnbjgmefkgdddjlbokphdefk。检查您的实施是否仍然存在。

2.-也许您可以查看Google跟踪代码管理器，可以将此工具配置为在PageView（HTML.load）上的DOM上加载库，我不推荐您这种做法，您＆＃39 ; ll减少发送到工具的点击次数（并减少会话次数）。

3.-将代码移到页面底部：由于之前的原因，这不是一个好主意。

4.-这个，但它仍然不正确，你只能延迟图书馆的负担

＆＃13;

＆＃13;

$( document ).ready(function() {
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

    ga('create', '[MyId]', 'auto');
    ga('send', 'pageview');
});

＆＃13;

＆＃13;

＆＃13;

所有这些都将两个代码分开保存

我强烈建议您检查这两个库是否是真正的原因。