微信小程序无埋点数据采集方案

作者:lxj,点餐终端团队成员

前言  

相信业务团队对这样的场景不会太陌生:

  • 打点需求: 每新上一个功能,数据产品便会同步加上打点需求,当数据打点上线后一段时间,数据产品/业务产品便会针对数据的转化率分析和对业务需求的调整;
  • 打点正确性验证:当某一天数据转化率大幅度变化不符合预期,数据产品/业务产品便会和开发确认打点的位置是否出现纰漏;
  • 线上问题排查: 接到上报一个线上问题,然而开发们却无法重现该case,此时需要有线上对应该case的数据才能进一步分析问题,倘若没有数据,那这个问题很可能将变成一桩“悬案”,便会遭受多合作方的质疑和对于业务稳定性的安全感大大降低。

由此数据是很重要的,我们接下来从数据采集的重要性、数据的划分、采集方式以及在微信小程序中的埋点方案几个方面来一起详细聊一下数据采集。

一、数据采集的重要性

本篇我们重点讨论数据采集,暂不详细论证数据的作用,先归纳总结一下数据对于性能优化、业务增长和线上问题排查的重要作用,这也是我们为什么需要埋点的原因。

数据对于线上问题排查的作用:

  • 用户行为数据还原“现场”,帮助分析和定位问题,提高问题定位效率
  • 对于问题分析提供有力证据

数据对于性能优化的作用:

  • 帮助发现和监控在线业务的关键成功指标
  • 帮助发现最需要优化环境及其优先顺序
  • 帮助发现所面临的挑战的信息和改进决策
  • 帮助提供对应用测试和优化更好的分析

数据对于业务增长的作用:

  • 帮助衡量市场营销效果
  • 帮助发现激活转化效果的策略
  • 帮助发现用户留存和用户活跃分析
  • 帮助产品营收变现分析

二、采集数据划分梳理

从第一大点,我们总结了数据的重要性,不同的业务项目对于数据重要性的侧重点会有不同,那数据采集到底要采集哪些数据呢?

首先闭环数据包括:

  1. 用户行为
  2. 用户信息、CRM(客户关系)
  3. 交易数据、服务端日志数据

以上三项数据,才算是一个完整数据流闭环,当然不同的业务场景中数据还可以再更细划分,大体的关键点基本不超出这三项。对于前端的数据收集来讲,闭环数据中前两项主要由客户端上报数据,而第三点主要由服务端记录数据,客户端辅助,因为交易请求真正到达服务端完成处理才算是完成交易的一个闭环。用户行为数据又包括——时间(when)、地点(where)、人物(who)、交互(how)、交互内容(what)五个要素,和新闻五要素有点类似;用户信息有的业务涉及到用户敏感信息和隐私等需要授权,所以用户信息由业务场景定夺具体维度,最基本的数据需求是能唯一标识用户;CRM、交易数据和用户信息类似,具体所需数据细节由业务场景定夺,CRM基本数据需求是登陆信息、会员相关信息,交易数据包括——交易时间、交易对象、交易内容、交易金额、交易状态。

三、数据上报方式

聊完数据,下一步便是需要知道如何获取到我们真正所需要的数据。数据上报方式大体上可以归为三类:

  1. 第一类是代码埋点,即在需要埋点的节点手动调用接口上传埋点数据,友盟、百度统计等第三方数据统计服务商大都采用这种方案;

  2. 第二类是可视化埋点,即通过可视化工具配置采集节点,在前端自动解析配置并上报埋点数据,从而实现所谓的“无痕埋点”, 代表方案是已经开源的Mixpanel;

  3. 第三类是“无埋点”,它并不是真正的不需要埋点,而是前端自动采集全部事件并上报埋点数据,在后端数据计算时过滤出有用数据,代表方案是国内的GrowingIO。

重点讨论无埋点,可视化埋点其实可以算是无埋点的一个衍生故可视化埋点在此不讨论,主要对比代码埋点与无埋点。

3.1代码埋点或Capture模式的埋点缺点

对于数据产品来说:

  1. 依赖人的经验和直觉判断。
    业务相关的埋点位置需要数据产品或者业务产品主观判断,技术相关的埋点则需要技术人员主观判断。
  2. 沟通成本高
    数据产品确定所需要的数据,需要提出需求与开发沟通,且数据人员对技术不是特别熟悉,还需与开发人员明确相关信息否能上报的可行性。
  3. 存在数据清洗成本
    随着业务更迭变化,之前主观判断所需的数据会存在更改变化,此时对之前打点的数据就需要手动清洗,且清洗的工作量占比并不小。

对于开发来说:

  1. 开发人员精力消耗
    埋点对于业务团队来说,常常被相关开发人员所诟病。开发技术人员不能只关注技术,还需分散精力做埋点这样高度重复且机械性的任务。
  2. 埋点相关代码侵入性强,对系统设计和代码可维护性造成负面影响
    大部分的业务相关数据点都需要手动埋点完成,埋点代码不得不与业务代码强耦合在一起。即使业界已有无埋点sdk,数据产品关注的业务特殊点也逃离不了手动埋点。
    在业务不断变化下对数据的需求变更,埋点相关代码也需要跟着变化。进一步增加开发和代码维护成本。
  3. 易错、漏
    由于人工打点存在主观意识差异,打点位置的准确度难控,且易漏数据
  4. 存在打点流程成本
    当数据漏采或错采时,又要经历一遍开发流程和上线流程,效率低下。

3.2无埋点优势

与手动埋点相比较,无埋点优势便不用多解释。

  1. 提高效率
  2. 数据更全面,按需提取
  3. 减少代码侵入

四、微信小程序无埋点sdk方案

4.1 无埋点数据需求

  • 小程序的初始化执行情况上报
  • 接口请求上报
  • 错误上报
  • 用户行为上报


         由于小程序不同于web服务,不存在js /css资源加载一说,所以更关注的是小程序初始化状态和执行情况的记录和捕获上报情况,图中资源完整性检查对应初始化完成性检查。线上小程序中的请求域名都必须是https协议的,故dns劫持概率大大降低甚至不大可能发生,且从客户端监控DNS劫持可行性较低(存在悖论),暂不考虑DNS劫持捕获情况。

4.2 针对微信小程序开发无埋点sdk的难点及重点

  • 无法直接拦截/监听请求
    微信请求统一通过微信API完成 ,请求模块已被微信方封装,且小程序的运行环境不是浏览器对象,不像web应用那样重写封装很自如。
  • 三种运行环境的监控兼容性保证
    • Android 上,js运行环境是 X5 内核
    • iOS 上,js 运行环境是 JavaScriptCore
    • 开发工具上, j s运行环境是 nwjs(chrome内核)

  • 用户行为无法直接监听
  • 强拓展性
    需要适用于多种架构设计场景(小程序)下使用
  • sdk需轻量
    每个小程序的包存在2M的限制,并且小程序并不支持在代码中引入npm包,故sdk本身会占用2M的大小限制。虽然小程序有分包的内测,但该功能未完全放开,再者作为一个sdk体积过大也是不合理的。
  • 数据收集量大,尽量减少性能损耗
  • 不影响业务(基本需求)

4.3 微信小程序无埋点sdk设计

数据层设计:


数据流走向设计:




采集方式设计:

接入方式:

   在小程序初始化代码之前引入sdk npm包代码,小程序打包代码时将sdk代码引入到项目中初始化后即可自动打点收集数据。初始化例子如下:

import Prajna from './lib/prajna-wxapp-sdk.js';Prajna.init({channel: 'channel',env: config.IS_PRODUCION ? 'product': 'beta',project: 'yourProjectName',methodConfg: {} // 业务特殊关注的方法执行和自定义打点名称})


无埋点结合埋点:

    小程序的无埋点方式,可以获取到大量的数据基本可以做到用户使用场景的高度还原。SDK打点的粒度是到某个方法的执行,对于业务特殊关注点的粒度小于SDK粒度时无法单纯靠SDK无埋点完全解决,可采用无埋点和埋点相结合,故我们的小程序无埋点SDK也提供手动埋点的API接口,完善数据的完整程度,进而解决更多的问题(回顾参照数据重要性提到的作用)。

五、小程序无埋点SDK中遇到的问题

除了解决了前文提到的针对微信小程序开发无埋点sdk的难点及重点所面临的问题外,还遇到了一些新的问题。

  1. SDK本身会对业务性能造成一定成都影响,数据暂存放在了小程序的localstorage中,多次较频繁的存/取小程序的localstorage在业务方本身较耗费性能的情况下会暴露出操作卡顿问题。减少localstorage的存/取操作,只在页面关闭时未上传的数据才存入localstorage
  2. 全量无埋点的数据量庞大,灰度上线时遇到过服务器过载导致服务器可用性下降的问题。后续对于数据上报的量有所控制,只自动上报关键节点数据,其他业务关注节点可通过接入初始化时针对性配置再上报,避免上报过多冗余数据。此外对于上报数据结构的设计也需要尤为注意,结构目标是要清晰、简洁、便于数据检索(区分)。
  3. 初期原本想针对灰度上线做一个SDK使用与否的“开关”,避免小程序回滚流程。由于“开关”依赖server接口控制,而请求是异步的,意味着初始化过程以及小程序启动都必须等到控制开关的接口返回才可进行,否则“开关”就相当于失效的。 考虑到SDK不能影响到业务性能,丢弃“开关”,在SDK内部做好try、catch,避免对业务可用性造成影响。

有了无埋点上报获得数据,后续便可以利用数据来解决很多问题。对于数据的利用请期待下节——数据的应用篇。


参考文献:

[1] 【美】培基,译者:姚军等,《深入理解网站优化》,出版社:机械工业出版社,出版时间:2013-08

[2] 张溪梦,《首席增长官》,出版社:机械工业出版社,出版时间:第1版 (2017年11月6日)


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/366886.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

php异步请求$.post,如何用PHP实现异步请求、忽略返回值

本篇文章的主要内容是用PHP实现异步请求、忽略返回值,具有一定的参考价值,有需要的朋友可以看看,希望能对你有帮助。项目需要,场景如下:某个条件下需要调用接口发送多个请求执行脚本,但是由于每个请求下的脚…

Linux NTP

ntpd服务的设置: ntpd服务的相关设置文件如下: /etc/ntp.conf:这个是NTP daemon的主要设文件,也是 NTP 唯一的设定文件。/usr /share/zoneinfo/:在这个目录下的文件其实是规定了各主要时区的时间设定文件,例如北京地区的时区设定文…

《React 学习之道》The Road to learn React (简体中文版)

通往 React 实战大师之旅:掌握 React 最简单,且最实用的教程。 前言 《React 学习之道》这本书使用路线图中的精华部分用于传授 React,并将其融入一个独具吸引力的真实世界 App的具体代码实现。 如何掌握 React 存在特别多的路线图。本书提…

vue.js(三)

这里该记到vue的组件了&#xff0c;组件基础篇 1.vue组件的基本书写方式 Vue.component(button-counter, {data: function () {return {count: 0}},template: <button v-on:click"count">You clicked me {{ count }} times.</button> }) 上面定义了一个名…

Nuxt中如何使用Vuex-Store异步获取数据

Nuxt是一个基于Vue.js的通用型框架&#xff0c;它集成了使用Vue开发的绝大数组件/框架。 长话短说如何在Vuex-store中获取异步数据呢&#xff1f; 在Nuxt中由于集合了Vuex还有其他的一些配置&#xff0c;大大的方便了我们使用Vuex&#xff1b;在Nuxt官方文档中写到&#xff1a;…

Struts2面试问答

Struts2是用Java开发Web应用程序的著名框架之一。 最近&#xff0c;我写了很多Struts2教程 &#xff0c;在这篇文章中&#xff0c;我列出了一些重要的Struts2面试问题以及答案&#xff0c;以帮助您进行面试。 什么是Struts2&#xff1f; Struts1和Struts2之间有什么区别&…

基于canvas的骨骼动画

最近学习到了一种关于canvas的骨骼动画&#xff0c;听这个名字就知道他和canvas之前的动画不同&#xff0c;不知道你有没有兴趣了解一下呢&#xff1f;关于骨骼动画最初是无意间在腾讯团队上看到的&#xff0c;但是由于他官网的教程是在是少之又少&#xff0c;也就仅有一个小de…

Python APSchedule安装使用与源码分析

我们的项目中用apschedule作为核心定时调度模块。所以对apschedule进行了一些调查和源码级的分析。 1、为什么选择apschedule&#xff1f; 听信了一句话&#xff0c;apschedule之于python就像是quartz之于java。实际用起来还是不错的。 2、安装 # pip安装方式 $ pip install ap…

NetBeans 7.4的本机Java打包

成为“ NetBeans 74 NewAndNoteworthy ”页面的NetBeans 7.4的新功能之一是“本机打包 ”&#xff0c;在该页面上被描述为“ JavaSE项目现在支持使用JavaFX提供的本机打包技术来创建本机包。 ” 我将使用一个非常简单的示例来演示NetBeans 7.4中的本机打包功能。 下一个代码清…

基于Vue开发一个日历组件

最近在做一个类似课程表的需求&#xff0c;需要自制一个日历来支持功能及展现&#xff0c;就顺便研究一下应该怎么开发日历组件。 更新 2.23修复了2026年2月份会渲染多一行的bug&#xff0c;谢谢深蓝一人童鞋提出的bug&#xff0c;解决方案是给二月份的日历做特殊处理&#xf…

php 打开word乱码怎么办,如何解决php word 乱码问题

php word乱码的解决办法&#xff1a;首先打开“/Writer/Word2007/Base.php”文件&#xff1b;然后添加“$objWriter->writeAttribute(‘w:eastAsia’, $font)”内容&#xff1b;最后保存修改即可。PHPword解决中文乱码一、增加东亚字体支持打开并编辑路径/Writer/Word2007/B…

Java开发人员访谈的MindMap

多年来&#xff0c;我曾在许多Java开发人员访谈中担任小组成员。 之前&#xff0c;我曾写过一篇标题为“成功进行软件工程师技术面试的7大技巧”的文章&#xff0c;其中涵盖了很少的一般准则。 在本文中&#xff0c;我将分享一个思维导图&#xff0c;其中包含Java开发人员访谈中…

送给大家一个好看的简历神器

很多人看到里边有好看的东西就习惯性的点进来看看&#xff0c;还一边点一边想 —— 好看的简历我见多了&#xff0c;你这个又能好看到哪里去。我想差不多可以&#xff1a; 哪里吧因为最近有在准备简历&#xff0c;就习惯性的找一找有没有现成的简历模板。结果全是付费的&#x…

PHP简单实现单点登录功能示例

1.准备两个虚拟域名 127.0.0.1 www.openpoor.com127.0.0.1 www.myspace.com 2.在openpoor的根目录下创建以下文件 index.PHP 123456789101112131415161718<?phpsession_start();?><!DOCTYPE html><html><head><meta charset"UTF-8"/&…

JUNG 计算图属性,中心度,偏心率,直径,半径

本文介绍利用Java的第三方API JUNG 计算图中&#xff1a; closeness centrality&#xff1b;// 图中某节点的 接近中心性/亲密中心性 betweenness centrality&#xff1b;// 图中某节点的 中介中心性/介数中心性 distance; // 图中两节点的最短距离 eccentricity; // 图中某节…

Java VM –提防YoungGen空间

您可能从我们以前的面向性能的文章中看到&#xff0c;健康的JVM是实现最佳应用程序性能和稳定性的最重要目标之一。 这样的健康评估通常仅关注主要收集的频率&#xff08;避免&#xff09;或检测内存泄漏的存在。 年轻一代空间或短寿命物体的大小和足迹如何&#xff1f; 本文…

小程序绘图工具painter-json文件绘制保存分享图-可点击任意元素触发函数

Painter是由酷家乐移动前端团队打造的一款小程序绘图组件。 原项目地址&#xff1a;https://github.com/Kujiale-Mobile/Painter 新版地址&#xff1a;https://github.com/shesw/Painter 这款交互版原来是为了针对业务中的新需求而由我自己开发的&#xff0c;后来需求改动&a…

4 张动图解释为什么(什么时候)使用 Redux

dev-reading/fe 是一个阅读、导读、速读的 repo&#xff0c;不要依赖于 dev-reading/fe 学习知识。本 repo 只是一个快速了解文章内容的工具&#xff0c;并不提供全文解读和翻译。你可以通过本平台快速了解文章里面的内容&#xff0c;找到感兴趣的文章&#xff0c;然后去阅读全…

您正在使用什么垃圾收集器?

我们的研究实验室正全速前进。 随着最近的资金注入 &#xff0c;我们只能保证我们不断创新的步伐只会加快。 我们进行的部分研究与GC优化有关。 在处理这个有趣领域中的问题时&#xff0c;我们认为可以分享一些有关GC算法使用的见解。 为此&#xff0c;我们对使用特定GC算法的…

前端布局推进剂 - 间距规范化

我是一个爱折腾设计的前端&#xff0c;一直都在标榜自己的页面还原是多么的牛 X 。怎么做到页面还原&#xff1f;我有一个最笨但是有效的方法&#xff0c;就是把设计稿直接存成图片&#xff0c;作为背景图然后临摹着设计稿进行开发。我觉得自己太有才了。像素级还原有没有&…