如何改进 Google +1 按钮的代码让它读取的更快

标签： Google技巧 Google +1 Google Fail JavaScript | 发表时间：2011-06-08 10:07 | 作者：musiXboy 木頭
出处：http://www.guao.hk

为网站设计的Google +1按钮发布以来，谷奥就立刻部署上了，但大家也发现了一个严重的问题──谷奥网站打开速度变慢了，Google +1按钮总要等上数秒甚至是数十秒才能读取完毕出现在页面里。今天Aaron Peters给出了几个优化的意见，大家可以参考一下。

首先是一定不要把那段Javascript代码放在<head>标签里，这样会拖慢整个网页的打开速度。最好是将其放在</body>之前，这样页面可以完全打开，之后再等待+1按钮慢慢读取。其实Google如果再上心点，做成类似AdSense和Google Analytics那种非阻塞形式的JS代码就更快了。

其次，Aaron发现Google的Javascript代码只允许浏览器缓存6分钟，这其实也导致了我们再次打开网页时候速度依然快不起来。Aaron还发现Google提供的代码有个小瑕疵，其中的http://apis.google.com/js/plusone.js应该改成https链接，否则浏览器会做一次自动跳转，又耽误了一点时间。

最后，Aaron建议在Google改进之前，这么来写Google +1的代码还能快一点：

<!-- Place this tag just before your close body tag -->
<script>
(function(d, t) {
var g = d.createElement(t),
s = d.getElementsByTagName(t)[0];
g.async = true;
g.src = 'https://apis.google.com/js/plusone.js';
s.parentNode.insertBefore(g, s);
})(document, 'script');
</script>

<!-- Place this tag where you want the +1 button to render -->
<g:plusone></g:plusone>

Via GOS

© musiXboy 发表于 谷奥——探寻谷歌的奥秘 ( http://www.guao.hk ), 2011. | 14 条评论 | 永久链接 | 关于谷奥 | 投稿/爆料
Post tags: , ,

相关 [google 按钮 代码] 推荐：

如何改进 Google +1 按钮的代码让它读取的更快

- 木頭 - 谷奥——探寻谷歌的奥秘
为网站设计的Google +1按钮发布以来，谷奥就立刻部署上了，但大家也发现了一个严重的问题──谷奥网站打开速度变慢了，Google +1按钮总要等上数秒甚至是数十秒才能读取完毕出现在页面里. 今天Aaron Peters给出了几个优化的意见，大家可以参考一下. 首先是一定不要把那段Javascript代码放在标签里，这样会拖慢整个网页的打开速度.

图解添加Google+1按钮过程

- Genius - cnBeta.COM
据国外媒体报道，Google今天在其搜索结果页面中推出了社交搜索“+1”按钮，但该功能目前只向部分人开放. 要使用该功能，首先必须在 https://profiles.google.com/中建立Google个人档案.

Google +1 按钮明日推出

- HRS - cnBeta.COM
Google今天官方宣布“+1按钮”功能将于明日正式上线，任何网站都可以添加这一社交代码来获得用户的推荐，同时Google Analytics工具也开始添加有关+1按钮的分析数据，帮助网站运营方统计受欢迎的信息，其功能和作用跟Retweet和Facebook的Like一样.

Google +1按钮已可向Google+朋友圈分享内容

- MZ - cnBeta.COM
据美国科技新闻网站TechCrunch报道，谷歌于今天宣布，用户通过点击谷歌“+1”按钮，可向Google+中的朋友圈分享自己正在浏览的网页. 当用户点击“+1”按钮时，会弹出一个含有网页图片和文字的对话框，用户可选择朋友圈分享这些内容. 谷歌还允许网页制作者定制显示的图片和文本内容.

Google Sites 允许站长加入 Google +1 按钮

- Aaron Woo - 谷奥——探寻谷歌的奥秘
今天，Google Sites也可以在页面里直接插入Google +1按钮了（如上图），你可以直接将其插入到侧边栏里，这样它会在所有的页面里出现. © musiXboy 发表于 谷奥——探寻谷歌的奥秘 ( http://www.guao.hk ), 2011. | 没有评论 | 永久链接 | 关于谷奥 | 投稿/爆料.

手动开启 Google Docs 里的 Google Drive 按钮

- Felix - 谷奥——探寻谷歌的奥秘
感谢读者 fan zeyi 的热心翻译. 打开 Google Docs（用 Chrome 浏览器），然后打开开发者工具(扳手->工具->开发者工具). 然后通过下拉菜单找到 docs.google.com/ 这个项目, 然后搜索 “config ['cookieFetchElement']”（大概在365行左右），然后在行号上点一下设置断点（行号会变蓝）.

Google Maps 更新，带来气泡按钮、导航改进

- 阿三 - 谷安——谷奥Android专题站
Google Maps app for Android 更新到 5.9.0，继续对 Transit Navigation（导航）功能进行了改进，然后还新增了一个实验室功能. 用于 Transit Navigation（导航）的语音和铃声通知（测试）. Transit Navigation （导航）平板支持（测试）.

Google正测试在搜索结果中添加“Add To Circles”按钮

- kxxoling - 36氪
现在，Google正在寻找越来越多的方法将Google+整合到其他google产品中去. 最近的一个动作是：在你的搜索结果中间添加一个按钮，这样就可以将相关内容的作者添加找你的Google+的圈子中去. Google最近一直在研究如何给将Google+整合到搜索结果中去. 开始的时候是将+1按钮添加到搜索结果中去，后来是将博客作者的头像（可以链接到Google+）添加到了相关搜索结果条目中去.

Google 官方：对 Android 手机硬件菜单按钮说拜拜

- - 36氪
Android 手机的硬件菜单按钮终于要消失了，这次是 官方的声明. Google 的 Android 团队在博客中宣布 Android 手机不再需要一个专门的「菜单」按钮. 当然，这不意味着 OEM 厂商们不会继续在手机上提供这个按钮，但从 Google 的角度来说，菜单按钮已经是过去时了. 几个月内，所有 Google 授权的新 Android 手机将不再有这个按钮.

全代码打造简洁美观回到顶部按钮

- - 我爱水煮鱼
这次，潜行者m给大家带来一个比较实用的 jQuery 技巧，为你的网站添加一个纯代码画出来的、简洁美观的回到顶部按钮. 这个按钮的效果就是，当页面滑动一段距离之后，就会浮现出来这个按钮，点击这个按钮之后，就自动滚动到顶部. 点击之后就会跳转到顶部，然后这个按钮平滑消失. 与网上的相比，潜行者m版的是纯代码，加载速度更快，效果色彩控制好；代码精简，只有数条而已，拒绝大坨大坨的代码.