写博客不知道有没有人看, 会很空虚. 统计不是为了 KPI, 就是图一乐.

这个博客的页面统计有两套系统, 各管各的.

Busuanzi 显示在文章页面上, 读者能看到每篇文章被看了多少次. 它是开源的, 不需要注册, 脚本一引就行.

Google Analytics 在后台跑, 只有我自己能看到. 用来分析流量来源, 用户分布, 热门内容等.

两套互不干扰.

Busuanzi (前端展示)

Busuanzi 是不蒜子的英文名, 一个极简的阅读统计工具. 没有后台, 没有 Dashboard, 只有一个计数器和一段 JS 脚本.

引入脚本

在 layouts/partials/js.html 里加载:

{{ if .IsPage }}
<script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>
{{ end }}

只在文章页加载, 首页和列表页不用.

显示阅读量

在文章页模板 layouts/_default/single.html 里:

<div class="article-tag">
  <i class="fa fa-eye"></i>
  <span id="busuanzi_container_page_pv">
    <span id="busuanzi_value_page_pv">0</span>
  </span>
</div>

Busuanzi 的脚本加载后会自动查找 id="busuanzi_value_page_pv" 的元素, 把阅读量填进去. 数据存在 Busuanzi 的服务端, 不需要自己维护.

工作原理

Busuanzi 的逻辑很简单:

1. 页面加载时, Busuanzi 脚本向 busuanzi.ibruce.info 发请求
2. 服务端根据当前页面的 URL 路径统计访问次数
3. 返回该页面的阅读数
4. 脚本更新 DOM 中对应元素的内容

每次页面访问, 阅读数 +1. 同一个 URL 积累的数据是全局的, 不管你用哪个域名, 只看路径.

缺点是数据的精确度一般, 有时候刷新页面并不会立刻 +1, 有延迟. 但作为展示给读者看的大概数字, 够了.

Google Analytics (后台分析)

Busuanzi 只提供阅读数. 想知道"访客从哪里来", “用什么设备”, “看了哪些文章” 这种问题, 需要 Google Analytics.

引入脚本

还是在 layouts/partials/js.html 里:

{{ if not (in (hostname) "localhost") }}
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-129382678-1"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-129382678-1', {
    'anonymize_ip': true
  });
</script>
{{ end }}

只在生产环境加载. 本地开发时不触发, 避免开发环境的访问污染统计数据.

anonymize_ip 启用 IP 匿名化, 符合 GDPR 要求.

跟踪维度

GA 记录了这些内容:

• 流量来源: Google 搜索, 直接访问, 社交媒体, 外部链接
• 用户设备: 桌面端 / 移动端, 操作系统, 浏览器
• 地理位置: 国家 / 城市
• 行为: 访问了哪些页面, 停留时间, 跳出率

对博客来说最有用的数据是流量来源和热门内容. 知道什么文章被搜得多, 什么渠道来的流量多, 可以决定后续写什么方向.

隐私考虑

GA 涉及用户跟踪. 做了一些处理:

• 启用 IP 匿名化
• 不启用广告功能 (没有再营销, 没有受众分析)
• 不跟踪个人身份信息

作为技术博客, 不需要也不应该过度追踪读者. 知道一个大概的流量趋势就够了.

不过话说回来, GA 毕竟会被广告拦截器屏蔽. 技术博客的读者不少都开着 adblock. 所以 GA 的数据本身也是不全的. 看个趋势就行了, 别纠结具体数字.

两者对比

两套不冲突, 各有用处. Busuanzi 给读者看, GA 给自己看.

性能考虑

Busuanzi 脚本约 5KB, 异步加载, 不阻塞渲染. GA 的 gtag 脚本也是 async 加载.

两套脚本都只在文章页加载, 首页和列表页不受影响. 对整体页面加载速度的影响可以忽略不计.

唯一注意: Busuanzi 的服务在国内, 海外访问偶尔会慢. 但阅读数只是一个展示性的数字, 加载慢了也不影响页面功能. 所以用了 async, 加载失败也不影响其他功能.

文章链接：