如何实现前端埋点方案
粉丝2003获赞3.4万
相关视频
03:22查看AI文稿AI文稿给大家分享如何优雅的做数据买点啊，数据的买点可以帮我们的运营同学提供有力的数据，我用户点击某按钮或图片的时候，我会把用户的这种点击的行为上传到后台， 通过买点我们可以获取用户的一些交互的习惯，从而优化整个项目产品的一些流程，进一步提升用户的体验，尤其是对一些电商的网站，这样的话能提高你的产品的转化率。 那么我们买点上方方式一般都是手动买点，就相当于他点的按钮，我会在业务里面加相应的上报，对吧？还有一个可算买点，可到买点，这个很少用，都是在基本上配一下，这个就是无痕买点，无痕买点就是说一般的广告位，对吧？会经常用到啊，一般的话我们会统计这种用户 进入页面或离开页面他的 pkuv， 包括页面停留时长。点击买点，也就是说我们要记录用户在浏览商品的过程中点击的哪个商品， 包括点击的次数。还有一个曝光买点，就是说对一些广告位，对吧？我只要曝光了，我就会进行收费。那么我们的买点啊一定要与业务代码进行了分离，一定要独立于业务，不要对业务代码做一些侵入。还有一个就是说我们需要约定统一的切口来进行买点的进行上报。首先来看一个 voe 的一个买点，看我实现的一个效果， 这个是我的首页，我点击表格，那么我就对对这个表格进行买点，就说用户点击了按钮，那个这个是怎么样实现的呢？那么我们肯定要 追寻我们的原则，我们业务代码要和你的买点逻辑要分开，通常做法是我们会制定一个指令，这个指令然后去统一收集用户的买点，然后我在业务代码里面具体怎么用呢？我需要用，用到这个指令，对吧？也就是说我会把数据 放到这个元素的属性上面啊，我获取这个属性，这样的话其实对于我的业务代码是侵入是非常低的， 这是一种方式。还有一种方式也提到了我们要统计这个用户的时长，比如说他切不同的路由的时候，我切走之后，那么他就会统计在这个后面这个路由下，他停留了多长时间，对吧？我再贴回去 啊，他在原来录一下停留了多长时间，这个时间其实是我们在路由里面说白了就是做了一个拦截啊，计算他，他从进来到粗细，他停留了一个时长啊。我们在这个康定的方法里面，这个方法里面相当于我们做了 一个计算。还有一种买点，就是说咱们提到的就是广告位的买点需要用到一个最新的 api， 就浏览器提供了这个，这个 api 是监听这个滚动的四件，那么这样频繁的触发性能有很大的问题。 这个 aps 他相当于帮我们做了处理了他的场景，一般是商品出现在用户眼前的时候，也就是浏览器四窗的时候，就称之为 也是制定一个指令啊，相当于通过这个 api， 这个 api 相当于会有两个参数，第二参数是一个回料函数，第二参数是一个对象，这个图片出现在百分之五十的区域的话，我就认为你就曝光了。嗯，曝光的话，那我我会就进行相应的上报了，那么可以看一下呆萌，往下滑的时候 再往下滑，哎，看到没有？这个出现了，出现，出现一了，对吧？我就把这个数据放到这个输入里面上包我再划， 哎，图片最后一点呢？我统计完我进行上报，对吧？啊？通常的做法数据都是你有一个这种小的技术图片，一般的做买点的话肯定要 碰撞一个 idk 吗？肯定有一个跨越的这种现象，所以说用 a 妹子这种方式，他其实可以处理跨越问题，这个就是体积小，一般这个这种小图片基本上就是几十或者几百个币，对吧？这个能对大限度的减少对页面的影响。
1204大伟聊前端（全栈AI）
04:13查看AI文稿AI文稿通过简单的数据买点数据上报的一个小功能，就能够判断出你是初级程序员还是资深程序员，背景是这样的，团队里面在做数据上报的功能，就比如说这个网页， 我要统计用户点击了哪些按钮，什么时间点击了什么按钮，做了什么的操作。那么我们前端要加这样的买点，拿到数据我肯定要调后台的阿里克的接口，通过阿里克斯往后台进行上报数据，然后后台再根据每一段时间的数据做一个报表的统计。具体的记录方案呢？ 按照我们常规的思路，大家可能会这么想，比如我这个是要上报的数据对象，这个要上报的后台的接口， 那么这个是真正发送阿贾克斯请求的代码，用户点一下我就调一下这个接口，对吧？比如我点这个按钮，我就调一下这个接口，上播一次，这个是没啥问题的，你要考虑我们在发 送上报数据的时候，尽量的不要去影响你的业务的接口，那么我们要处理我们上报的接口是不可以放到后台去执行，防止阻塞主线程。我们可能会放到山东 tom up 里面去做处理， 当然你也可以用一部现成，比如说我放到 work work 里面，是吧？然后这里呢往下走，然后我继续我的正常的业务的处理， 这是一种方案，当然我们还可以继续优化，比如我们是不是可以先判断一下浏览器是否空闲，比如说浏览器空闲的时候我去上报啊，如果不支持，我再放到另外一个 义务的任务里，不影响主业务啊。这方案其实是这样一步一步进化的，但是你有没有发现其实还有问题，什么问题呢？你想想看，我页面上点一次上爆一次，点一次上爆一次， 那么最终我上报的是什么东西呢？我上报的就是这个地方的一条一条的数据，也就是我的数据可能是一条一条的上传，你有没有考虑过 一条一条上传是不是合适？如果根据你的业务的体量，如果你的用户量比较大，你是一个外网的 to c 的产品，数据量是非常大的，那么你对对这个服务商贸的接口的压力也是非常大的，那么我们可以进一步优化。这个时候我们可能 定义一个法词，比如说我的法词就是五十条，我进行批量上传，比如说用户在这地方点一次，我把这个数据存在内存里面， 里面存一条数据放到数组里面，如果他的点击次数大于等于五十次的时候，我就调一次这个按两个接口去上报，一次超过五十条我就去上报，那么我 上报了这五十条完，上传完之后我要删掉，这是一种另外一种优化方案，但是我上传失败呢，我还要进行重试，因为我真的要把我的数据上报出去，如果我的数据丢了，你就不准了吗？那这一块还有情况，比如说我网络断了时候怎么办？比如说用户在这个地方点了七八次，做了七八次的次的操作， 这时候他还没有累计到五十条的时候，其实他不会往后台进行上报，不会发抓带。可是接口请求，比如说他到了正好到了五十条，发现你这个用户的网络不稳定，断了， 怎么办呢？所以说我们还要监控这个网络的状态，如果网络离线了怎么办，对吧？一般的方案我们会把这个数据存到这个啊， local store 这里面，对吧？等他下次再进到这个页面来，我先从 local store 里面取出来，如果数据有的话，我就进来，这个页面我就上报。进来上报的肯定是上一次你关闭网页，或者你因为网络失败而存在这个 log story 这里面的数据，对吧？上传完之后我再删，可以想象一下，就一个简单的数据的上报，如果你真的想做了 的很完美，各种情况你都要考虑进去，大部分人都会有的思路，点一次调一次阿尔克斯呗，对吧？但这种方案是行，但是不是最好的，对吧？就像好多人说做项目没有难点和亮点这个东西， 并不是说没有难点和亮点，是有，只是你没有去发现，或者说你的这个方案，你的这个技术点，你的这个技术架构不是最优的、最全的。所以说我们在思考问题的时候，一定要向前一步，更深层次的去思考。
457大伟聊前端（全栈AI）
25:38查看AI文稿AI文稿这节我们讲买点相关知识，买点是数据采集和分析最基础的一步，那么买点啊是一种常用的数据采集方法，买点呢其实就是数据的来源，采集的数据可以帮助业务人员分析我们业务的用户使用情况，以及我们业务的一些核心数据， 是我们后续进行业务分析的一个基础。在这一节我们会主要学习啊这几方面的内容。首先我们会介绍常见的买点方式，然后我们会介绍在哪些场景下，我们应该选择何种买点方式来进行买点。 那么接下来我们会结合的案例来讲，我们如何去设计买点的方法论是怎样的，我们结合具体的案例来进一步学习和掌握应该如何去设计买点。最后啊，会给大家介绍一下我们在买点中常见的一些误区，避免大家在以后的买点中遇到这些问题。首先 让我们来看一下买点的方式，买点方式主要有两大类，第一类啊是前端买点，第二类啊是后端买点，前端买点呢还包括代码买点、可视化买点以及无买点。 让我们首先来了解一下前端买点，后端买点，前端买点主要是在客户端进行采集一些数据，在客户端的一些行为意味着可以啊收集更多客户端的数据，这些数据呢其实就是用户事件行为，然后呢我们的界面变化等等， 通过采集用户的行为数据呢，然后帮助我们后续的一些分析用户相关一些数据的一些工作。那么后端买点它主要是在服务端进行的买点收集啊，与服务端的这样一些数据，意味着收集了什么样的数据呢？是 h t t p request 这样发生一些数据的请求，获取 更多是业务层的一些数据，然后这些业务层的数据呢，主要是一些业务逻辑，还有接口调用之类的这些数据，比如说业务的交互的啊，这些数据后段买点他其实啊他的实施性会更高，更准确。 让我们来看一下前后断卖点，我们应在何种方式下选择呢？前断卖点其实是我们处于运营的初级阶段啊，产品功能相对简单的时候，我们想分析一些用户行为相关的数据，那么我们选择前断卖点， 也就是需要分析于后端没有一些交互的前端行为的时候啊，这个时候呢，我们选择前端买点，后端买点相对于前端买点的话，可以解决一些前端买点面临的数据安全性和数据容易被篡改这些问题。同时呢，也可以收集一些前端无法 获取数据啊，比如说服务器的小于时间，四亿元的占用情况等等。采集数据时啊，其实有时候啊，会优先选择后端买点，尤其是在各行业有特殊的业务数据需求的时候啊，因为后端买点他的实施性会更高一些， 比如在线的播放啊，游戏安装这些，要根据买点的设计些用户的中奖信息之类的啊，这些呢，其实显然都是需要通过后端的这个买点来实现的，这样设计的也更更合理啊。 那么另一方面啊，当我们去追求这个精细化运营的时候啊，需要进行多维度数据分析的一些企业，有时候呢也会尽量通过后端买点呢去采集些数据，因为这些数据呢会涉到像包含用户的这样一些啊，资产数据，用户的啊，账号体系数据啊，风控的辅助数据啊等等。 这个时候呢大多会选择后端买点来实现。接下来我们看一下我们的前端买点的代码买点方式。代码买点呢，其实啊主要有前端的工程师手工啊，在程序中去写一些代码，然后通过我们写的代码上报数据来实现呢， 其实是通过纯手工写代码呢，这个时候呢需要用买点的 sdk 函数，在需要买点的业务逻辑的位置上呢，调用这个接口来商贸我们的数据。那针对于代码买点，他的优点还是比较明显的，就是灵活， 方便设置自定义的属性啊，这个和自定义的事件。其次呢可以控制啊发送的时间啊，时机和机制，还有发送的方式，因为我们是通过代码去买点的，那么会更加灵活，我们可以选择在某种场景下啊，触发这个机制， 我们可以控制数据的一个准确性，因为代码买点其实啊会更安全一些，也会更准确一些。代码买点话他这个缺点也显而易见，因为啊是人工在代码中买点，他的工程量就会很大，那每个空间的买点呢，都需要去填代码，这个呢就会导致我们的人力成本 呃变高。另一方面就是我们买点一旦有更新，或者说我们漏掉了一个买点，那么我们还要依赖于下次的发版啊，然后呢才能把我们这些问题去修复，所以说他的这种更新即视性啊，并不是特别好。接下来我们看一下前段买点中的可创买点， 其实这种买点方式的话，是把核心代码和配置资源给分开了，然后呢通过部署在产品上的基础代码呢，对产品的所有的交互的元素啊，进行一些解析。看这句话看不懂也没有关系啊，因为你作为这个数据产品经理的话， 那么我们在使用这样的工具的时候，我们会打开定制页面直接去操作啊，所以说人人都可做这样一个买点啊，是非常简单的，能够快速上手，他的门槛呢是比较低的。那这种买点呢有什么好处呢？就是简单方便，快速买点 啊。第二的话就是无需版本更新，节省人力和更新成本，就是他对所有的版本都会生效，不像我们前面说的大码卖的一样，如果说我们漏掉了，还需要通过下一个版本的才能够去啊，补充对的买点，那才能够更新对的数据。然后呢这个的话也有对应的缺点， 他的缺点呢是比较受限啊，上报的信息呢，上报的行为信息也是还有限的，因为什么呢？你不能够去私定义的啊，私定一些事件啊，包括他的手信，因为他已经有一些通用的规则啊，我们只能说是啊，在他的这种通用的这个 规则的旧商啊，来做一些数据的上报，而且这种方式的话，像瀑布流的啊，这种方式我们也不能够去多买点。最后我们来看一下前端买点的无买点这种方式，无买点这种方式呢，最近被鼓吹的特别火啊，好像无买点就会比这个代码买点和可视化买点要好很多一样。 当然他有他的优势啊，有他的缺点，他的优势什么呢？就是无需买点，但是呢，他其实什么他的原理是什么啊？通 sdk 前段呢，会自动全量的采集全部试点并上报买点数据，用户呢，出发任何试点时呢，都会自动上报数据，他适合做什么呢？ 比如说我们的这个页面，点击啊，热力的分析啊，啊，技术门槛低啊，部署呢，也特别简单。他的缺点啊，主要有三方面啊，第一个四定义的属性不灵活，传输实效性差，为什么你没有给他去定义啊，他是 自动的根据自己那些规则去上报的，这些数据的形式并不是业务导向的，因为我们有时候是针对性的去分析一些特定业务场景，需要做一些定制化的一些卖点。最严重的一点是他需要增加服务器的负债， 因为他是全量上保数据的，这样的话就会导致数据存储的空间会增大，会浪费你很多的数据存储资源和贷款资源。 生活前面的三种前端买点方式啊，我们来综合做一下对比。首先我们来看一下，按业务需求啊，私定买点，那么代码买点呢，他依据占据很大的优势，而可视化呢和无买点在这方面呢，就稍微弱一些啊。 第二个支持自定义传餐，就是前面我们有对应的啊，这样的一个例子啊，讲到了这样的传餐这方面，那么代码买点是支持这样一个传餐的，支持瀑布流的 交互数据这一块也是单位买点啊，才可以做到前面呢，其实我们也讲过，那么需要业务人员参与这一块啊，无买点啊，首先是肯定是不需要人员这个参与的，他会把我们所有的数据啊，都会给上网上来， 而代码买点和客商买点都是需要业务人员参与的，在代码买点中，业务人员主要是定义我们的买点方案，由开发人员呢去进行一些代码相关的买点。 在可视化买点这方面呢，幼儿园呢，需要自己去做这样去操作。然后呢去设一些买点，这里的幼儿园啊，主要是指的数据的产品经理添加买点时版本更新这方面， 其实代码买点和雾买点啊，都需要做一些更新啊，如果有一些买点变动，或者说有一些买点上线，那么都需要版本更新啊，去支持，有下一版 版本呢才能支持，而可视化买点呢，就不存在这方面的问题。在人力成本这一块啊，当然是代码买点的人力成本最高啊，他需要业务人员呢和开发人员呢，都需要 这个深度的去参与其中，而且每次买点的改进和设计都需要投入大量的人力成本在上面。在可视化和业务操作这一块，当然是可视化买点占优势啊，因为它主要就是为这方面而生的。我们再来看立值数据可回速这一块， 这个雾霾点啊，是做的比较好的，因为雾霾点话，他把我们想要的数据跟不想要的数据啊全部给上报了上来，这相当于是一个全亮这个数据啊。所以说呢，在励志数据回溯这块啊，会比较好， 在自发获得启发性信息这块，因为我们在去做数据挖掘的时候啊，有些信息呢，可能会关联去用到啊，所以说呢，对于像这个 有大码买点啊，可视化买点这块，他们并没有采一些多余的额外的数据上来，那所以说呢，在这个我买点这块呢，是一个全能数据这块呢可以更好的去给我们可能会提供一些啊启发性的信息，对独有版本生效这一块啊，可视化买点呢， ok， 做的比较好。 在服务器和网络啊，传输压力这一块，当然是雾霾的压力比较大啊，这个的话我们在前面讲过，因为他这个全量的数据啊，对这个网络贷款服务器压力都会比较大，是用简单的业务 啊，简单的分析的需求的话，这三种方式都适用。对于复杂的业务的话，我们最常用的啊就是买点这块，也只有这个单买买点这块啊， 才能够去满足这三种买点方式。对比啊，也是在涉及到买点相关的这样一个面试问题的时候啊，面试官常问的。最后让我们看一下针对这三种买点方式我们应该如何选择。首先我们看一下单买 它适用于啊这样的场景，比如说我们对这个事件进行这个传三啊， cd 属性的时候啊，我们会去整理这样一个满脸的文档啊，这个时候呢 大买点，大买点呢，就是可以结合我们的具体场景啊，去做买点啊，灵活度是特别高的，那可上买点跟这个无买点，就是我们对一些特别简单的场景又频繁这样的，你比如说频繁的发布发布，比如说 这个上线频繁上线一个功能或者更新 h 五，对吧？或是我们做一个简单的活动的时候， ok， 这个时候呢，我们更倾向于这样可差化的买点，或者是无买点。选择完买点方式之后啊，让我们来看一下如何设计前后端的买点。 对于前端买点，不仅是 k y 六的形式不同场景呢，会更复杂，那对于后端买点来说啊，主要就是使用这种 k y 六的这种形式进行买点。 因此接下来的内容啊，重点介绍前端买点如何进行设计，因为学习了前端买点后啊，也就很容易掌握了后端买点。在介绍买点设计之前，让我们来看一下买点设计应该遵循哪些原则啊。首先啊， 同种属性的多个事件呢，要命名为一个买点事件 id， 并以 k y 六的形式来区分不同属性的多个事件呢，应该命名成多个买点事件 id 啊，此时呢，也尽量不用 k y 六的形式买点。这里面说的同种属性，其实主要是指性质相似的事件， 比如说在页面上的操作啊，有点击、拖拽、拐灯等行为，那这些形式相同的事情呢，都可以命名成一个实验 id， 例如我们可以把它命名成啊 action type。 然后呢，赋予 click drag screen 若等歪柳值，也就是分别对应点击、拖拽和拐动等这些事件。而不同性质事件呢，不要拼凑在一起，比如说，比如说不能把点击、拖拽、拐动这些事件行为呢，和按钮、页面这些对象类型放在一起，这时候呢，要尽量命名成都， ok。 因此， k y 六的形式的埋点设计原则是 k 啊，一般表示某个事件，比如说我们是 x time 这种系列类型，还说 pay name 这种页面类型之间的， 呃，这个之类的这种，还是说配内幕这种页面类型之类的这种，然后 value 呢，表示相应的值，比如说它是对应 click drag， ctrl 这些点击拖拽还是管动之类的这些值。那么一个 k 啊，可以对应一个外流或者多个外流，像我们刚才讲的例子里啊，也很容易看到啊，比如说我们的 这种典型世界，可以 x type 可以对应多个外率值，分别对应呢？ click drag， scroll， 让我们结合一个具体案例啊，来看一下前端的单码买点方案，背景是这样的，美团 ap 呢，上线了活动 a 和活动 b 两个活动呢，都在酒店啊和旅游的入口呢，这个页面进行了半段展示， 大家可以看标题这上面这个图片啊，那么想知道的话，这两个活动啊，应付的访问情况。那么问题来了， 就这个背景啊，我们如何去针对这个我们的指标体系啊，如去设置这样的一个买点， 那么经过梳理这样的指标题，指标字典，具体梳理这个方法呢？ ok， 我在上一小节里面也介绍过，对吧？这里呢，其实我们主要是看这样两个数据啊，我们就能 得出这样一个点击率，我们要看的就是点击率，这个核心指标点击率等于什么呢？点击率等于点击的用户数，除以查看的用户。 ok， 那么问题来了， 我们如何对这个点击数和这个长按数进行买点统计呢？我们来看一下具体的案例。首先啊，看第一种买点方式啊，通过梳理呢可以得到活动 a 啊有两个入口，那么活动 a 酒店入口按钮对应是叫 id 一，活动 a， 旅游入口呢，对应是叫 id 二， 活动 b 呢酒店入口呢对应是 id 三，活动 b， 旅游的入口按钮呢对应 id 四，也就是说我们把每一个活动按钮啊都对应这样一个事件去进行设计。针对这种买点思路，我们看一下啊梳理出来的买点方案，那么在功能这一块呢，范围活动 a 与活动 b 用户行为这块啊，活动 a 呢，点击啊九零入口这个试卷类型呢？当然为这个点击啊，点击试卷，然后呢试卷呢，我们也给他啊，有一个 id 的这个名称啊， active a hotel inter 配置啊， 然后同样的对于这个活动 a 的旅游入口进行活动 b 的这样两个酒店进行旅游的入口呢？哎，同样我们这样去设计，大家可以看一下这种买点方案，每一个活动啊，他都会对应的用户行为呢，对应一个买点，那这个呢，其实啊会有四个这样这个买点记录 看上去我们达到目的了，可是他后期的维护成本啊，是蛮高的，其实大家可以想一下，那每上线一个活动都需要增加一个买点的 id 吗？这样会不会工资量特别大，如果后期我们商业的活动特别多，那么后 后期的维护成本是不是很大？后期的这个出数据处理这个成本，包括人的理解的成本啊，是不是很高？大家带着这个问题呢，我们来看一下活动方案二， 那么方二啊，他跟 ppt 展示的这样，他使用 qw 这种形式啊来表示这个呃，这样一个业务的分析的一个思路，首先呢用页面来源啊这个配置呢来表示， 那么配置主要对应活动 a， 活动 b 啊这两个活动。然后 sos 呢，表示我们的元素类型，那么它的 k 是什么？它的 k 是 sos 对应的 y 六啊，就是啊，这两个这样的一个按钮。 好，大家可以看一下这种方案。如果说我们后期啊增加这样页面的话啊，那我们增加对应的活动的话，那我们在这个页面里面再增加活动 c， 活动 d 就可以了，对不对？好，如果说我们增加对应的这样一个按钮的话， 那我们在这个元素类型 sos 里面我们增加其他的按钮啊就可以了。结合这个买点方式啊，我们来看一下这个买点的外档怎么去写，我们更能啊。首先是要统计酒店和旅游啊两个入口的点击事件，那么用户行为呢，主要是在这两个呃页面的点击酒店和旅游按钮这样一个行为。 那我们针对刚才设置的配置和 south 两个 k 分别对应什么呢？配置对应的是 x v x b 啊， south 啊，对应是 hotel butt 及其呃 trail butt， 分别表示酒店的按钮和旅游的按钮。这样其实我们很容易就可以通过我们的配置和 south 的试一下类型，很容易就可以查询数据， 比如说我们要查询点击酒店按钮啊，进入页面 a 的这个数据，那我们就可以通过配置等于 active a and source 等于 hotel button and action type 等于 clip 啊来查询数据。大家是不是觉得这种其实更容易理解啊，不用去再发各种的买买卖呢，而且维护起来啊，更方便。通过方案对比啊，我们也可以看一下啊，方案二的买点呢，主要有这三个优点啊，第一个他的维护成本低啊，更简单高效， 新增时呢，只需要在更新买点这个文档这个 y 六里面增加值就可以了。比如说我们啊，再增加这样的一个活动页面 啊，再增加这样一个活动页面，那我们就 active c， active d。 那我们增加 souls 的话啊，增加这样的入口按钮的话，我们在这里去增加就可以了。第二点呢，就是减少沟通成本， 提高其他业务而言，数据分析师啊，根据买点日志进行查询数据的这样分析效率就跟刚才的例子一样，查询的时候就直接把 根据四段的这个 y 六值啊，就可以快速去查询到，不需要这个记录其他一些比如说时间 id。 第三点，扩展性好，对于未来上线新活动或者业务的调整会更加灵活，在应用的基础上扩展啊，这个的在例子中啊，大家也很容易看到，我们增加 y 六值就可以了啊，非常方便。 最后让我们来看一下前端买点设计的一个实力啊，在一般的买点方式中啊，我们其实会有几个事件啊，就是我们会有主要的曝光事件，点击事件和页面停留失常这些事件， 那么针对这些事件，我们分别看一下如何去设计我们买点。首先来看一下曝光事件，那么什么叫曝光事件？是曝光事件，主要是啊，记录页面被用户浏览的次数，是记录买点时这个记录这个页面流量最常见用的这样一个事件，他是 在什么机制下去上报的呢？当用户成功记录我们这个页面时啊，我们这个页面就会记录一次曝光事件，那么刷新一次页面，我们还会记录一次这样的曝光事件。但是当用户啊，你比如说有些手机的现在还有 home 键啊，如果切换出去的话，这个时候就不会去上报， 但是现在其实大部分的手机已经去掉了 home 键，那为什么点击手机的 home 键切出去，我们就不会去上报事件呢？因为他已经退出了一批啊，其实我们如果记录这本数据的话，对我们这一个分析啊，并不会特别友好， 因为它相当于是一部分的脏数据，它并不是我们真实想看到的真正的曝光的数据。那针对这个曝光事件，我们可以看一下。呃，比如说我们在进入啊，这个酒店旅游住宿页面，那我们啊进入之后呢，就会有一次这个上报，一次这个曝光线，那么应该通过 k y 的形式，如果 去设计买点呢，那么 k 我们可以设置一个 action type， 它的 value 是什么呢？ open page， 当我们的 action type 等于 open page 时，说明我们进入了一个页面，它的含义是打开页面，往往我们还要会用另外一个四段来记录啊，他到底是打开了哪一个页面，打开哪个页面呢？我们可以用 page name 这个字段，那 page name 啊，等于 hotel mean page， 就表示我们打开了 hotel mean page 这个页面。那通过这种买点方法呢，我们就啊能够去统计出来我们的这样一个打开这个美团酒店啊，这个主页的这样一个包装情况， 然后接着我们来看一下点击事件，那什么叫点击事件？点击点击吧，我们打开页面，当我们点击的时候就会触发事件，比如说我们点击的按钮，对吧？通常的我们会用点击事件来评估页 面对向使用情况啊，比如说我们点击了一个这个酒店住宿啊，这样的一个啊，酒店民宿的这样一个按钮，那么我们就想，哎，了解多少人年纪了，这是很常用的 case 吧，那他的商贸机制是怎样的？ 其实很简单，当用户点击一个页面上的某个对象，我们就会上报一次数据。拿左下方这个图来说啊，用户呢点击页面这个酒店，这个民宿这个按钮呢，就会上报一次试卷。那我们如果设计这个试卷呢，我们通过 q y 六的形式来设计， 那 k 有 action type， 那个点击试件儿的话就是 link， 就是我们这个 action 的 type， 是什么呢？是曝光呢？还是点击呢？我们明确它是 click， 是点击然后 enter type， 机器 enter name 啊，这两个 k 呢，分别表示我们点 点击对象的类型和点击对象的名称。我们点击对象到底是一个吧台呢？还是一个搬着呢？还是一个其他的一个对象呢？那我们呀还要表示出啊这个对象的名称，那他是这个一个酒店旅游这个酒店住宿的这个按钮， 那我们最后还要定义出来它到底是在哪个页面被点击的，哎，就是配置内幕，那这个可以，它对应是 app me page 啊，就是我们的主页点击的。所以总结下来，点击世界上的四要素啊，我们在哪个页面啊？以何种方式点击了哪一个按钮？明确啊？是 click， 而且要明确 actually time is click， ok， 这四要素， 我们记住这四个时段啊，前两个 x type， anti type 啊，这是要明确这类型，后两个要明确啊，点击的对象， 点击所在页面。最后我们再来看一下页面的停留时长，那页面停留时长其实主要是用来记录用户啊，在页面停留的这个时间，他可以通过记录用户进入时间啊，这个 t 和离开这个时间 t 二来进行计算， 他主要是用来评估页面或者功能啊，对用户一个粘性，这样一起情况就是我们用户在这个页面停留多长时间，那么如果停留少的话，那是不是他不喜欢我们这个功能， 或者根本不想用我们这样的一个功能啊，那这个页面停留时间计算规则就很简单，对吧？公式的话就是页面停留时间等于，哎，离开页面停留的这样的一个 t 二，减去这样一个啊，这个是 t 二，这个的话是 t 一。 那针对这个例子呢，我们看这个右边啊，我们想了解一个用户啊，在每天酒店这个页面停留时间，那么我们啊就可以记录 这两个实验，一个是用户进入这个页面时间啊，进入页面这个触发一个时间，然后呢，用户啊点击这个右上边这个返回按钮，这个就表示用户啊已经离开了我们这个当前的页面，记录发生这个这个时间的话呢，就是 tr， 所以这个事件 x type 这个类物配置就是离开这个页面，那离开哪个页面呢？我们当前这个页面的名称，那在这个试卷里面呢，我们可以给他定一个时间啊，定一个时间叫用户停留时间，你可以自己命名一个这样的一个名字，对吧？那进来的话是有一个时间的啊，出去是有一个时间，然后这个 y 六的话，那就是这个时间这个差，这就是页面的停留时长。 好，接下来我们看一下买点设计的误区，就是我们在设计买点的这个过程中啊，会遇到哪些问题？就大家会有第一步就是，哎数据的价值，那这个数据价值其实主要体现在后面的数据的分析，进行数据的这个应用层面，很多同学 呢，因为不管不顾啊，后面让些这个使用，就觉得，哎，买点无所谓，大家一定不要小看买点这个这个事情啊，因为他是数据采集的第一部分， 我们说整个数据链路就是从数据的采集开始的，你后面的数据的加工，数据的这样这个搭建对应的看法，分析数据，包括英语数据，对吧？都是取决于你最 初始的这样一个数据啊，如果你最初始的这样一个数据，数据的质量比较差的话，那么后面所有的工作你都无法去展开啊，所以说数据的采集是非常重要的， 所以说呢，我们做买点时候一定要严肃的看待买点啊， ok， 第二个有的人会觉得这个无买点啊，还挺方便的，那是不是他就优于这个代码买点，其实在前面我们也说了无买点，有无买点的这样一个好处，代码买点呢？有 代码买点这样一个灵活性，我们要根据这样具体的一个场景啊，去选择合适的买点方式， ok， 第三个误区的话就是 那买是这个设计和买点这个方案，感觉，哎，太复杂了，那我所以说我干脆啊，就是用一套买点方案就行了。这里要说一下，就是如果说你不从你的行业的特性及其业务场景来去设计买点话， 那都是在耍流氓，都是在偷懒，我们一定要去根据我们的业务场景和需求来试这样的一个买单方式。最后让我们对半截做一个简单总结， 那买点呢，主要分为前端买点，后端买点。其实前端买点呢，主要包括啊，代码买点、可说话买点和无买点这三种方式。那在买点方式选择这一块，那我们要根据啊不同业务场景的需求啊， 选择合适的买点方式。而在买点设计这一块，我们要避免一些坑。同种属性的多个事件要命名啊，这个成一个买点 是 id 并 qw 的形式，这样区分不同属性的多个世界儿呢，应命名成多个买点儿世界儿 id 啊。此时呢，尽量不要用 q y 六的形式在设计买点儿世界儿时啊，常用的买点儿世界儿其实主要有曝光事件，点击事件和这个停留时长， 这个呢我们也有具体的对应的例子，大家再去回顾一下。那最后啊，买点在事业上呢，会有一些误区，买点呢很重要，会影响数据的质量，没有任何的一种通用的数据产业的方式是适合所有的企业的，所有的业务场景的。所以说我们应该根据不同的业务需求啊，选择合适的买点的方案，本小集呢，我们就讲到这里，谢谢大家。
740AI产品经理PM GAO
20:32查看AI文稿AI文稿哈喽，大家好，我是老陈。那最近有个同学啊，在跟我说，老陈我进了新公司，但是呢，公司给了我个新任务，我不知道怎么去解决，因为我都没有听过这个知识点啊。呃，他说要我做数据买点。 啊，这个是什么东西啊？那 ok， 那好，那我相信很多同学都没有听过什么是数据买点，而且呢对前端来说， 哎，前端怎么跟数据买点有什么关系啊？啊？是跟数据又有什么关系呢？对吧？那好，那今天的话，我们就跟大家来详细讲一下关于前端的数据买点。 好，那首先的话就是什么是这个买点啊？什么是买点？那么，呃，在我们的这个数据采集领域啊，那么尤其是就是说我们这个前端来说，就是说我们前端他是跟 用户直接进行一个互动交互的啊？那比如说我们像当前的这个页面，对吧？那当前这个页面的话，那我比如说跟用界面进行互动，或者是说我想要完成 购买这样子的一个目标，那或是去我去访问某个页面，对吧？好，那我在购买的这个就是说我要达成购买的目标，那么我可能会需要访问，就是说，呃，很多的页面，或者是说去做很多的这个跟页面交互的一些动作， 那这里面不要达成某个目标，那在这个中间点啊，我那么这个中间的这个路径，对吧？那中间的这个交互的动作，那么我就可以进行一个埋伏，哎，就是埋伏，就是说什么一个意思呢？就是比如说我点了这个，点了这个点击事件，对吧？哎，我 点击购买购物车，对吧？又或者是说，哎，我在点了购买这个购物车之后呢，我又来回的在，比如说，呃，他有两个，比如说 iphone， 对吧？ iphone 这个十三啊，那 iphone 十三的话我点击加入购物车，但是呢，就是 在那个选项里面，他有一个，比如说二百五十六 g 还是五百一十二 g， 我进行来回的这个 点击啊，有时候我不太确定我到底是想要是呃五幺二的还是二百二百多的这样子的一个啊？大小，那这个说的话，那么我们的这些动作啊，就会被作为一个记录， 哎，就是说他就会在这个埋伏，埋伏我们做这个记录，哎，看一下我们这个这个是不是我们的这个选项是不是过于，比如说，呃，有，有些情况就是这样子，哎， 比如说来回点，来回点了之后呢？我就没有点下一步了，你说我可能就卡在这里了，就是因为我太犹豫了啊，我在这两个选项里面我一直犹豫就可能给用户造成了困扰啊， 那 ok， 导致他最终没有下单，那我就可能通过这样子的一个数据去了解到这样子的情况，明白我意思吗？ ok， 那所以的话也就说他是通过我们这个前端啊，通过我们这个 js 在这里做，因为我们 js 就是做专门的这个互动的，对吧？就是做这个监听的，那好，他就可以监听到我们的这个行为的数据，好，我把这个行为的这个数据，还有这个业务的数据啊，我给他进行一个整合 啊，那 ok， 那我这个时候我就可以得到，我啊，像你这个啊，就是推这个，就，或者是说，呃，或者是 说啊，我得到一个，就是这样的一个情况，对吧？就其实就得到一个运营的一些数据，对吧？就是我应该怎样去呃，修改，比如说我的产品，我怎样去修改我的网页，对吧？我怎样去修改我的这个交互的功能等等等等啊？一些内容啊？ ok， 那也就说还可以做到什么呢？就比如说我，我去访问头条，对吧？那我在访问头条时候，那么他可能就给我们展现了很多很多条的数据，对吧？或者很多条很多条的新闻，那 ok， 那这些很多条很多的条的这些新闻的话， 那么我要去选择哪一个，对吧？那这个的话就直接给我们很多条，那么这就叫展现，就直接展现给我们看。那还有一个呢，就是我们到底点击了没有，对吧？我点进去看了，那么这个就是我的访问量，对吧？或者 是我的阅读量， ok， 那如果我的这个展现量很多，就说很多人都看了这样子的一个视频，对吧？就是很多人都看到了这个视频的标题， 但是呢他就没有点进去看，那就说明这个视频呢，他这个什么不够吸引人，对不对？也就说他先不管他的这个内容吸不吸引人，反正呢就是说他这个标题还有这个图像制造就不吸引人的， 对不对？那 ok， 那所以的话，那很多用户他不点，那我后面的话，也就说会导致我就说把这个行为数据啊，实时的推送给我们的这个福气，就是我头条数据啊，头条福气，那头条福气呢？在接下来 的这个推送里面，对吧？他给推送给其他用户的话，那么他就尽量去少推这些，就是点击量不高的 这样子的文章或者是视频， ok， 你说他可以根据这些数据，对吧？来进行，呃，对我们的这个，呃推荐来做一个起到一个决定性的作用。那还有一个呢？就是 比如说我们访问进去了，对吧？我点击了咱们这个视频，那我点击视频的时候，那我在观看，比如说多少秒的时候，对吧？比如说，哎，这个视频十秒，十分钟，那么我在五分钟的时候，哎，我 突然我点了一下弹幕，对吧？我在此里面输入这些内容发送出去，那么这个时候他就会记记做一个记录，哎，这个用户在这一刻啊，就五分钟的时候，对吧？ 是发了这个弹幕， ok， 那么这个也就是说对这样子的一个交互动作来进行一个埋伏，把这个数据给他发，就是，呃作为统计的数据给他 拿过来。好，那这样话，那我就可以知道，就说，哎，比如说有大量的用户在五分钟的时候，是吧？发了这个弹，那么这个时候我就可以知道，哎，这一块啊， 这一块就是属于啊用户比较感兴趣的地方，对不对？那 ok， 那用户比较感兴趣的话，那我就可以，比如说我在推送 这个视频的时候，那我可以去截取五分钟，对吧？比如说五五分钟，五，这个五分零秒到五分十五秒的这个时间点， 在这个时间点的时候我去什么？我把这段这个做成一个 gif 图推送给用户，那用户看到这个，那他可能就想更加的就觉得，哎，这就是属于我们的这个前方高能的区域，对不对？ 对，那前方高能区域的话呢，我们就，呃会有更多的用户进行点击，那就会有更多的用户喜欢你咱们的这个视频啊，而且呢也会更加喜欢我们的平台，对不对？啊？是这样子的，好，那这样子话我们就知道，哦为，呃呃， 对于前端来说，那什么是数据买点，那我们就清楚了，对吧？啊？那买点呢？就是说我们前端通过我们的这个 js 啊，我们去做这个行为数据的一个记录啊，并且把这个记录 我们去发送给到我们的这个福气好，当然的话，这里的话这个有别人封装好的，对吧？别人封装好的，那就是相对呢这个 sdk 啊，然后呢我们可以进行一个直接吊用啊， 减少我们这个自己写代码的一个量啊， ok 啊，就是这样子的，好啊，那为什么要去这个需要买点，那么我们也清楚了，对吧？啊？那么通过这个数据统计，数据分析，数据挖掘，对吧？我就可以，哎， 有更好的一个方式去指导我们怎样去提升我们的这个活跃度、流程度，对吧？新增度啊，等等啊，从而去了解整个产品的状态， ok 啊，就是这样子的。好，那接下来的话我们来看一下，就是，呃，对，还有一个点就是我们先了解一下，就是，呃， 有哪有哪几种方式啊？有哪几种方式？然后呢怎么去买点啊？怎么去自就比如说我怎么去通过这个 js 去买点啊，对不对？好，然后首先的话他这个买点呢，他总总共有 有三种方式啊，一种呢是，呃展现的买点，曝光的买点和交互的买点，那展现的买点呢？就是说，呃，我们在服务器，对吧？服务器端进行这个触发就可以制作一个记录，就是我 给到用户了哪些的这个数据，你说哪些的文章，对吧？哪些的视频？好，那么我把这个数据我就可以直接做一个记录，当然这个记录的话，我可以直接在后端做了，因为这个 内容啊是由后端决定的，对吧？就是后端决定，当然的话还有一部分就是什么呢？就是我前端啊，就说他有很多的这个分类，对吧？很多的分类。 好，那很多分类里面呢？我们点击哪一个分类，对吧？那去了解哪些的这个展现， ok 啊，那这里的话，我们其实就是我点击那个分类，其实 就是一个曝光度啊，又或者是我点击的是哪一篇文章，对吧？我真正去看了这个文章内容，那么这就是曝光哪哪一点啊？就是我们的内容 啊，真正被用户访问去查看了， ok 啊，就是曝光来点，又或者说因为我们都知道啊，我们呢？比如说眼睛，对吧？眼睛，那他核心一般就是什么？就是聚焦哪一块区域的，对吧？那比如说 他长时间的停留，比如说啊他滚，比如说我们现在这个页面，对吧？整个网页啊，有这么多的内容，那我滚到这一块区域的时候，那么我们的核心，对吧？可视的区域应该就是在这一块， 对吧？啊？一二啊，这两个点啊，一二这两个点的区域，那一二这两个点的区域的话，那么他就称为可视的区域， 或者是说一个曝光区域，也就是说用户对于这一块的区域啊，滚动到这个位置的内容非常感兴趣，对吧？那我可以做一个记录， ok 啊，这就是曝光买点，还有一个就是交互买点啊，交互买点就是说 通过跟用户进行互动和点击啊，来进行这个买点，比如说，哎，在什么时间点用户点赞了，对吧？啊？在什么时间点用户暂停了，对吧？他暂停他可能，呃， 或者是说啊，他暂停是为了就什么记录这个视频上的一些内容，又或者是说他暂停了，他，呃直接退出去了，对吧？那这个时候我们就可以对这个 互动，对吧？哎，你说哪一部分内容用户更加感兴趣？哪一部分内容用户不感兴趣？我进行一个统计， ok 啊，那这就是我们的这个买点， ok， 那好，那对于我们前单来来说啊，那我们怎么去做这个啊？买点呢，对吧？啊？怎么去做？买点好， 好啊，然后呢？当然我们现在的话也也已经清楚了，对吧？就是买点啊，其实就是提升我们的这个产品的，对吧？就是用来做数据统计，然后呢去不断的去提升我们这个产品的这个啊功能，对吧？提升我们产产品的这个用户的这个流程度啊活跃度， ok， 好，呃，然后呢，我们在咱们这里的话，我们就直接呃来看一下，就是我们怎么去做这个买点，好吧？怎么去做买点好？那前端的话，像我们比如说，呃，我们要去获取一些基本的信息，对吧？那，那我直接就是把这个基本的信息发送给到福， 对吧？那发送服务器的话，我们就会有咱们的阿贾克斯请求，对吧？那我直接把这些数据啊发送出去， ok 啊，那用户服务器啊，就拿到这些数据的话，他就进行一个统计，把它保留下来。好， 那还有一些就是，比如说我可以去知道，就是，呃这些，比如说像什么域名啊，标题分辨率，对吧？这些就是一些基本信息，可以直接发给福气的。那还有一些呢，可能我们需要自己去统计，比如说我打开这个页面，对吧？他这个信呢？对吧？是 需要花费多久时间？那比如说我从这个页面啊到这个视频播放，哎，我要进行一个统计，那在这里的话我可能还需要就是说了解到就是这这个用户他的这个 网络的这个性能怎么样？或者说总共的这个，呃，总共，对吧？从我们的这个 dns 这个插曲，对吧？啊？就是说再到我们 我们的这个当前文档下载完毕，以及整个啊网页的内容，对吧？资源图片啊下载完毕啊，到最终这个显示，以及用户在什么时间点开始进行一个互动，对吧？他什么时候开始滚了 啊？滚动我们的这个页面，对吧？等等，他是开始交互的时候啊？是什么样一个时间点，我们要怎么进行一个对应的统计？ ok， 那么这个时候的话，我们就可以通过这个 pophone max 啊，就是 呃本身我们的这个全局对象，对吧？ pomes 啊来进行获取对应的这些内容。 ok 啊，是没有问题的，那这样的话我就可以知道啊，他的一个 dns 的解析时间啊， tcb 的连接时间啊，还有这个首页白屏的时间，那 把这些东西都进行统计的话，那我就可以知道，对吧？啊？整个全局的用户啊，那么他的平均，对吧？从 面请求到展现他总共用的一个时间大概是多少？又或者说大部分的人啊？他是什么样的一个情况，对吧？啊？不是说我们，比如说我在我们公司对吧？我搞了一个内部的局域网服务器，哎，我公司，哎这个服务器，对吧？我自己在公司内部访问很快很流畅，哎，但是呢我这个 是吧，这个外面的用户他访问的话，他可能，哎这个时候就很卡或者是延迟很高，那这样的话我们就可以什么通过这个所有统计啊，然后把进行一个分析。我知道，哦，原来，呃哪一块区，对吧？可能就出现了问题啊？ ok， 那就可以及时的进行一个反馈。 好，那那 ok， 那这里的话我们就可以把这些数据做一个记录，然后呢发送给到服装。好，那发送的话，呃，那还有就是 交互的时候，对吧？加交互的时候也是一样的啊，那比如说我点击了什么按钮，对吧？然后呢我去发送这样子的一个请求，然后把对应那些逻辑参数啊发送给到后端，当然的话，呃其实在在这个买点的过程当中啊，除了阿贾克斯请求之外呢，还有一个 很很多人都会去使用的一个方式，就是伪装成图像对象啊，传递给后端，而且伪装的最多的呢就是我们的这个 get 啊 get 啊？为什么会为为什么会有这样子的呢？哎，我们也一起来看一下为什么，比如说我们首先的话，呃，我们来看一下京东的，那京东的话，比如说我们在进行浏览的时候，他会就你可以看到他，就是他会随时的去，哎生存这些东西，对吧？啊？做这个记录啊，那像这个记录的 的话，比如说我们就可以看到有一个 log get 啊， log get 啊，这个不是说真的是有一个图片啊，不是真的是有一个图片，他这个就是用来把 这些我们买点的这些交互的这些数据，对吧？我滚了，我滚，从滚到什么位置滚到什么位置啊？然后看了哪些内容，他进行一个统计，然后呢把这些参数作为我们的这个请求，哎，你看作为一个请求啊，然后呢发送给到福气 啊，发送给他福气，那他的这个地址是什么？他的这个地址是 d， 他看到没有？ d 啊？ d， ok， 然后呢这里，这里的话，他其实也就说服务器，他就其实拿到这些请求参数进行做一个统计好， ok， 那为什么要用图片？为什么要用？ 那为什么他不用 png？ 为什么他不用这 bg 啊？但不是说不可以，也有人在用啊，但是呢用的最多的就是 d 啊，那 ok， 我们我来告诉大家为什么啊？当然这个的话，你要是在面试当中答对了， ok， 加 加很多很多分，好吧？啊，对啊，很多人都不知道，好吧，很多人不知道，包括一到三年的前段啊，很多他可能都不知道。好，那 ok， 那首先的话就是，嗯， 首先啊，他是第一啊，使用图像呢，他是可以防止跨越的，对吧？比如说我做阿夹克请求，我发送请求的话，那么我们都知道 js 的阿夹克请求的话，他是有， 在我们的这个浏览器端，它是有一个跨域的，一个防跨域的一个安全机制，对不对啊？那，那 ok， 那我们的图像它就可以解决 这个跨越的问题啊，就不会说，哎，我发送不出去，或者是我统计不了这个数据，对吧？第二啊，就是防止阻塞页面的加载，那么我们都知道啊，就是，呃， 我们通常就是创建资源节点之后，我们的这个浏览器啊，才会去实际上去发送这个资源的请求， ok， 那如果我们反复去操作这个动物，那么就会引发这个性能的问题，而且呢，我如果我们是去载入啊， js 啊或者 css 这些资源的话，就会阻塞页面的血缘啊，影响用户的体验，所以的话，我们就 肯定不会用这个 js， 对吧？因为，呃，或者 css 啊，像我们都知道，对吧？我们如果是 squepper 啊，这个直接 src 去引入， just 会引入这个宁可啊， hr ef 去引入 css 的话，那么这些的话也可以解决这个跨越的问题啊，也是可以解决跨越的问题，但是呢，他就会去什么主色页面的一个积压载，也会影响用户的体验，好吧。啊，所以的话，哎，这就是为什么我们会去使用图像啊，为什么会去使用图像？ 好。第三，为什么使用图像不用 png 和 jpg 呢啊？因为啊， png 和 jpg 他的这个最小的这种图像的这个格式啊， 像这个 bmp 类型的文件，他需要七十四个字节，那 png 的呢，他要六十七个字节，而我们的 gf 呢，最少最少只需要什么四三个字节，所以如果我们用 gf 的话，那么他就可以节约我们百 分之啊，四十一到三十五的流量啊，就是相同的，这样情况的话，我们可以节约众多，那肯定用肯定用节约最少的啦，对不对？ ok 啊，所以的话我们大多大多数都会采用相乘这种，就一乘一像素的一个透明的 gf 来进行上报我们的这些数据，因为呢，我们这些数据就是用来做统计的，对不对啊？并不需要这个后端告诉我们。呃，这个返回我们数据，告诉我们要要渲染什么内容，我们就是把这个用户的这些行为，用户的这些交互的动作， 把这些数据啊统计下来发送给到后端，好吧？ ok， 好啊，就是这样子的。 好，那 ok 啊，那这一切就是我们就可以自己去做的这个事情啊，就是当然的话，这个 每一个公司他的这个，比如说数据买点的这种系统，那都是不一样的啊，但是总的原理都是一样的。还有一种，还有一种呢，就是，呃，无买点，就是无买点，什么意思呢？就是很简单，就是我们直接去使用啊，人家第三方已经做好的这种系统，比如说百度的 啊，那百度统计的话，那么我们直接只需要什么插入这一段代码啊，到我们的页面当中，百度他就会自动帮我们统计出各种各样的这个数据啊， ok， 好，但的话这样这种的话就是说不需要。呃，这个什么，就是啊，我们这个手写对吧？写那么辛辛苦苦啊，这些就一段复制过来解决啊，全部搞定， ok， 当然啊，这种就是省时省力啊，但是呢不省钱是吧？你用人家 肯定要给钱，而且呢第二呢，就是这种的话，他这个数据就没有很针对性啊，没有很针对性啊，就不会说做到，就是，哎，我们根据自己业务，对吧？我想怎样弄就怎么弄啊，怎么统计就怎么统计啊，这个就没有办法做到，好吧？好， ok 啊，这就是我们的这个关于数据买点这一块这个内容。 好，那我们这一节课就讲到最，那相信大家对我们的这个数据买点都清楚了吧？啊？清楚的，同学在公屏扣个一。好， ok， 我们这节课就讲到最，拜拜。
192老陈打码
01:52
07:02查看AI文稿AI文稿我们的这个需求文档的最后的这个部分呢，通常就是数据买点的这个内容了，然后一般在大厂的话，可能会有这个专门的这个数据的同学，他们去铲除这个数据买点的这部分的内容。 但是如果你在一个这个规模比较小一点的公司呢，可能产品经理就需要自己去负责这个买点的这个梳理啊。那 我们这块就把这个技能也跟大家去做一个分享。我们在需求分析的这个部分呢，我们描述了说我们做这个需求所能获得的收益，通常这些收益呢，他都会对应着一些具体的数据指标。 那在需求上线之后，如何获得我们想要去观察的几些数据指标呢？我们就需要在需求实现的过程当中，定义清楚如何通过用户在前端操作的行为或者后端数据变化的这个节点来去上报一些数据。关于数据这块， 其实我们要掌握一个基本的方法论，就是我们要先基于我们的这个需求的收益，做出了我们的这个收益的预估，然后去分析我们论证这个收益需要观测哪些指标， 通过这个买点去实现获取这些指标的能力。再去在这个上线之后，通过这些买点数据的管理系统的这个筛选和查询去获得这些数据结果。最后我们基于这些数据去迭代我们的产品，呃，驱动我们去优化我们的这个产品。 比如我们发现说，哎，我们的这个查看商品到下单到支付的这个流程当中，下单到支付的这个转化率低于了行业的一个均值，那我们就应该知道说我们后续的重点优化方向就是提升这个指标。嗯，目前比较流行的这种买点的方式呢，就是我们要首先定义清楚我们这 这个事件的这个名称，然后定义这个事件上报的出发机制和上报这个事件的时候需要上报的相关参数有哪些？ 比如对于一个电商类的这个应用来说，核心关注的指标就是我们说的这个商品详情页的浏览量，订单的这个提交量，还有订单的支付量，订单的这个支付金额。 那基于这些指标呢？我们可能就要去定义买点试件，那可能对应的就是商品详情页的呃，浏览量，我们就需要去定义一个事件，这样浏览商品详情页 这个事件上报的时候触发的这个机制呢，就是当任何一个用户进入到我们的商品详情页的时候去上报这个时间，然后我们需要上报这个事件的同时，在这个时间里面需要上报的参数有哪些呢？可能就会有商品 id， 商品的名称、店铺的名称、店铺的 id、 商品的这个一级类目，商品的二级类目等等。那通过这个事件的上报这个参数的上报，我们就会知道说，呃，这个商品浏览这个事件发生的 uv 和 pv 是多少？那 pv 代表的是浏览的次数， uv 代表的是浏览的这个用户数， 那我们上报那些参数有什么用呢？我们之所以需要这部分的参数，是因为在实际工作当中，我们不仅关注这个平台总共发生了多少次商品浏览的这样的行为，我们还会去关注这个流量的一个分布， 比如说是什么样的产品，是哪个店铺或者哪个类目，他的这个商品浏览的这个流量是最大的。或者说我们说同一个类目下，不同的店铺之间，他们的这个商品浏览的分布又是怎么样的？甚至说在同一个店铺之内，那不同的商品他们所占据的这个浏览 情况又是怎么样的？整个这个数据买点和引用其实是一个非常有趣的一个部分，基本上在我们的这个线下课程当中呢，可能就会用两到两个小时的时间吧，去对这个完整的内容进行一个描述，最后大家都会觉得这个很神奇，像开了眼一样。 我们回到我们刚才提到的这个公告功能上来看哈，我们认为说用户查看了公告之后，再发生类似爆粗的情况的这个可能性就会下降，因为呃预期用户不会再点击下单的这个按钮了，所以这里的预期结果就是如果说用户读过了这个公告弹窗的通知， 那相较于那些没有读过公告弹窗的这个通知的用户，这些用户他们点击下单的这个报错的可能性就会更低，我们就可以快速的定义出来我们所需要关注的这个数据指标了， 有这个公告的阅读情况、商品详情页的这个下单按钮的点击情况，那对应我们可能就需要定义出来这样的两个事件，一个就是公告点击，第二个就是我们说的这个下单按钮的点击。那我们来看公告点击这个事件我们需要哪些参数呢？ 我们可能需要，因为我们可能会有不同的这个公告嘛，所以我们就要需要区分出来。嗯，具体用户是展现了哪个公告，那我们就需要有公告的这个 id， 这就是公告的唯一标识，每条公告的这个 id 是不同的。 那什么时候上报这个世界呢？对于这个点击这个世界来说，就是在用户点击那个弹窗上的我知道了那个按钮的时候进行上报。而对于下单的这个按钮的点击的这个事件呢，我们就需要增加一个是否成功的这样的一个属性，当用户点击这个下单按钮的时候，我们 去上报这个事件，并且基于这个呃，点击之后的这个结果是成功还是失败，上报是否成功的这个参数，这样我们就可以在上线之后去做这样的一个数据查询。我们把我们的用户分成两个组，一组是有过这个公告，点击的这个用户说明他已经阅读过这个公告了， 另外一组呢？是没有点过这个，呃，我知道了的用户。然后我们去看这两个用户，他们在下单按钮点击的这个事件上成功的那个比例的区分是区别是怎么样的？我们预期的结果肯定是， 嗯，看到公告的，看过公告的这个用户，他们会在这个不会报错的情况下去点积极给下单的按钮，那他们的这个成功率就会更高。如果说事实符合我们的这个需求，那就说明我们做这个需求的价值就通过数据得到了验证。 如果说这个事实不符合我们的预期，那我们就需要去找到我们迭代的这个方向，通过更多的这个买点事件和买点的数据，比如说用户的一些行为的数据，甚至包括用户的停留时长这样的一些买点的数据，去找到我们优化和迭代的这个方向。 大家如果能够听到这里把这部分的内容给听完呢？呃，能够判断出来大家对产品经理的内容还是非常感兴趣的了。当然有可能很多同学本身是对产品经理感兴趣的，只是觉得我讲的这部分不太感兴趣，所以不想往下继续听了。不管怎么样，我们基本上是把这个 呃，我自己吧，对这这些年对怎么去写需求文档的这个经验做了一个总结和分享。我们回到这部分内容的开头，那就是需求文档的格式绝对不是千篇一律的，大家一定要多吸收不同的内容，然后理解和应用， 最后呢把它内化成为你自己的这个能力。嗯，后续呢，我们就会进入到这个需求分析这个部分的详细解读了。然后如果大家感兴趣呢，可以在评论里面去留言告诉我啊， 或者说你有其他的感兴趣的内容呢，也可以去提出一个，也可以去通过评论告诉我，我也可以给大家准备相应的这个内容。
418产品经理随口说
00:53查看AI文稿AI文稿为什么大厂前端监控都在用之爱做买点什么是前端监控？哈哈哈。他指的是通过一定的手段来获取用户行为以及跟踪产品在用户端的使用情况，并以监控数据为基础，为产品优化指明方向，为用户提供更加精确完善的服务。一般来讲，一个成熟的产品运营与产品团队 需要关注用户在产品内的行为记录，通过用户的行为记录来优化产品研发与测试团队则需要关注产品的性能以及异常，确保产品理性能体验以及安全迭代。查了下资料，发现很多大厂的上报都是这么干，由于解释叫做，希望大家点赞加关注，方便需要的时候观看啊，真香哎！
17程序猿
05:19查看AI文稿AI文稿当我们去应聘数据分析师的岗位时，会发现越来越多的招聘要求都提到了数据买点这个词，那今天我们就来聊聊数据买点。哈喽，大家好，我是你们的冷凡社长。我们今天的主题是讲数据买点的整个工作流程，如果后面的视频里出现了你不理解的关键词， 你可以在搜索引擎上来解锁这个词，了解相关的内容。好，那我们就进入正题做数据买点有个先决条件， 就是公司需要有一套买点系统，这个系统可以是自己研发的，也可以是购买第三方的服务，可以是简单的，也可以是复杂的， 他的核心作用只有一个，就是让我们的买点工作可以顺利进行。另外这里还需要再理解一个概念，就是买点是如何产生的。我们来想要一个场景，你每天都要去公司上班，但是标识你的上班的时间是需要你打卡， 要是你下班时间也需要你打卡。假设没有打卡这个动作，那老板就不知道你是什么时候上班，什么时候下班，那通过采集你的打卡数据就知道了你的上下班时间，那这种感觉呢，就和我们在企业中进行埋点的感觉是差不多的。 另外在企业中数据买点既可能是数据分析师来负责，也可能是产品经理来负责，后面呢，我们就都假定以数据分析师来负责来讲这件事情。 当有了一个可以利用的买点系统或者是买点体系之后，那数据买点的第一个环节就是需要进行了解需求，或者叫需求评审，这一般是业务方根据他们的业务需求提出来的获取数据的需求， 那这个时候呢，数据分析师就要了解他们的需求，并判断并判断目前企业里面已有的数据能否满足他们的需求，是否需要买新的点，他们的需求是否合理，然后进行一系列的评审， 把这个需求敲定下来。在数据分析师充分了解了需求并接纳了这个需求之后，第二步呢，就是要写买点文档。买点文档的核心作用就是说把业务方的需求转化为买点工程师可以看得懂的文档， 他们可以根据这个文档把这个需求真真实实的落在代码上。那买点文档里面比较重要的几个内容是？事件是怎么定义的？属性呢？要填哪些？ 触发的场景是什么？在不同的场景下，哎，汇报什么样的值？主要是这个内容简单的来说就是最终实现的这个买点你要满足可以采集数据的需求，并且能方便我们后面的使用。 买点文档一般都是用表格来整理和维护的，这他的样子呢？大家可以在搜索引擎解锁买点文档范例等关键词。当数据分析师完成买点文档之后，就进入到了第三个环节，买点评审。买点文 那是数据分析师根据自己的了解来完成的，这并不代表说工程师可以真的按你的买点稳当来完整的实现这个需求，所以工程师需要评审你这个买点是否可以被完成，复杂度是不是足够高，是不是需要被简化，有这么一个讨论和评审的过程。 当一切沟通顺利之后，第四步呢就进入到买点开发的过程，那这个过程呢就是由买点工程师来完成的，这里面的细节就是说工具数据采集方式不同，可能会分为 h 五的买点，客户端的买点或者是后端的买点，那你的这个买点是谁来做 一些小细节的问题，我们现在讨论这个买点呢，都是基于开发来完成的这些买点动作，这样的买点方式会更精确一些。当然有些公司可能购买了一些第三方服务，进行的是可视化的买点方式，或者是叫无代码的买点方式，那这个时候买点开发的这个过程就可能会落在产品经理或者 数据平行师的头上来进行的。当买点开发完成之后，就进入第五个环节买点测试。买点测试一般都会由工程师进行一个大框架的制测，制测完成之后呢会提交给我们的测试部门的同学来进行测试。 在有些公司可能测试人手不足，这个时候也可能会数据分析师来参与到这个数据测试的环节中。买点测试的核心目标就是验证我们开发的买点是否与我们当初设计的一致，采集到我们需要的数据，并且没有错误。 当买点测试完毕之后，就进入到了第六个环节买点验收。一般现有数据分析师来进行来验证我们数据是否采集正确，然后会交由业务同学来进行验收，来确认是否是他当初想要的数据。那当我们验收完成之后，数据买点呢就可以跟随产品发布或者发版进行上线，这个动作 在正式的上线之后就会进入到第七个环节，叫线上验收或者是线上验证，在线上的环境中来验证我们采集的数据是否正确，是否符合我们的预期，线上验证也没有任何问题，那买点就可以正常来使用了，并当积累到足够的买点数据之后，就可以进入到最后一个环节， 数据复盘环节，就会根据我们的买点数据来分析我们这次的业务动作啊，是否有效，或者我们的活动是否有效，或者我们的新产品是否有效等一系列验证工作， 一些连数据复盘的工作，这部分工作呢也是业务方，也是我们数据分析师的重点环节。 ok， 之后我们来回顾一下整个流程，第一步，需求评审。第二步，撰写买点文档。 第三步，买点评审。第四步，买点开发。第五步，买点测试。第六步，买点验收。第七步，线上买点验收。第八步，数据复盘。 这就是整个数据买点的工作流程了。以上就是这期视频分享的全部内容了，关于下期视频呢，市场还没有想好做什么，但是这并不妨碍我们下周的游戏更新。 ok， 如果大家觉得市场的运动还不错的话，欢迎给市长点赞收藏加转发，谢谢大家！今天就新聊到这里，那我们下期视频再见。
311冷凡社长
10:09查看AI文稿AI文稿家介绍一款跟买点相关的一个 npm 组建库啊，非常好用。首先它是一个比较清亮级的组建库啊，名字叫这个 啊，这个英文单词不会读啊，就叫他就叫他了，反正是啊，大家下载就行了，下载方式就是 npmi 啊，然后下载完之后呢，在我弄的包，弄的猫的包里边啊，有这个他所有的文件 里边呢，有帕利特杰森和 uzmd， 也就是使用文档，具体使用的方式的话在文档里边啊， 我们先来说一下这个什么是买点啊？买点就是说我们公司新上迭代了一个产品啊，新上了一些其他的一些功能，嗯，就比如说我们 这是一个简单的呆萌实力啊，里边有上门按摩，上门理发这种东西。 对于这种新上的这个呃功能点呢，我们如果说公司想要统计用户的行为，采集一下他这个行为，他具体用的哪个多一点，什么时候点击的这个按钮，点击的哪个多一点呢？一般呢我们通过 买点的方式来统计这个用户数据，而目的呢是为了提高优化的进一步这个产品啊，对产品进一步的优化。 那一般呢，我们的买点都是那种代码买点，就比如说我在点击上门理发的时候，会有个点击事件，会向后端发送一个买点事件行为啊，这么这样做的就是代码买点，他有个缺点就是要不停的修改代码，就是项目里边的代码， 这种行为一般称之为就是应编码形式的买点吧。然后今天我们介绍的这个组建库呢，就是说我们只需要 nbmi 或者压一滴滴下载这个库之后呢，按照他的使用说明进行配置，即可完成咱们的买点需求。嗯， 先看他的这个使用说明文档啊，因为这个酷的话也是我开发的啊，所以说现在的话， 首先他这个是一个全卖点。什么是全卖点？就是在不入侵业务代码，我不需要在我采集的页面里面添加什么代码进行可立可试见啊，不需要这些啊，我只需要下载 npm 引用在闷点 gs 呢， 引入现金金之后，通过配置教会他的行为啊。然后还有一些就是关于 页面的性能以及所有资源加载啊，这个页面性能他也可以统计到，这个页面性能也是我们项目优化与提升的一个重要的关键点啊。还有一个是采集数据上传，他可以自带上传，只需要传入公司的请求服务器配置啊，当然也可以 操作咱们采取数据自定义上传啊，还可以搭配业务之前的代码买点，因为组件对外暴露有一个创口方法啊，调这个创口方法，他可以将咱们的代码买点数据和全麦的数据存储到一块啊，进行一个统一化的管理啊。 嗯，距离使用的话，我们可以打开中端，就是样 add 这个买点啊，当然我这个裤子呆莫里边已经装过了，所以就不操作这个了啊。然后首先要引入这个，因为这个裤子他暴露了出来，是一个对象颗粒化啊， 就是 class， 然后我们需要把这个 class 给扭一下啊，扭完这个他会返回一个对向实力，实力下面有一个印头方法啊， 里边有各样的字段，需要咱们配置第一个这样，又比如说这方太补啊，就是我们使用这个框架是哪种？目前的话该组间库它只兼容 v、 o、 e 以及 unif b、 a、 h 五和 react。 微信的话现在还小，程序他还不兼容，所以说这两天正在玩命开放啊，等更新了就是支持了会议及时通知大家啊， 版本号就是说迭代会有更新的话，组建库更新会请大家就是及时关注这个阿勇学前段啊，以公众号为主，然后 request 的 就是咱们的服务器请求配置啊，请求地址以及请求头，就是说咱们的 uid 头盔以及跟后端的验证字段啊，请求的 kiss 啊，模拟值是 y 六啊，这个字段就是跟后端协商的，你这个数据 k 值 ky 六值啊啊， 然后这个 mask requires 的这个认识啊，这个失误什么意思呢？就是说我这个数据存储多少条会进行上传，如果是一的话， ok， 那他就是实时上传，存一条，上传一条，然后我们默认是十条的啊，默认十条？为什么默认十条呢？十条的目的是为了一个 节省流量吗？啊？你上传一次性上传一条跟一次性上传十条，他消耗的流量是是一样的啊，但是次数会增加，流量增加。嗯，但是如果说我们不传这个请求 地址啊，那我们的组件他只进行存储，就说数据存储他不将上传啊，我们要自定义上传的话，我们需要操作它里边数据，至于他怎么操作数据，我们待会会讲啊，还有里边一些开关配置，例如 solog， 你的是否开启买点，是否获取 用户的定位啊，这个定位它默认是 first， 它是不获取的，如果我们想获取，要配置一下啊。啊，这个 use a in four use a in 扣 的，它里边得按照这个 数据格式传进去啊。这个 u 字扣他不一定是用户的账号，也可以是一个非，嗯，就是唯一 id 啊，他的目的主要是用于我们的这个数据存储的。这个表明啊，因为我们的数据存储采用的是 index dv 的方式进行存储，他有一个表 透明，保证唯一性啊。普瑞杰克的内幕啊，就是咱们的项目的名称啊，下面就是关键的点了咱们的采集配置，例如我刚才说啊，就这个地方我要采集上班理发，我要采集上班摸， 那怎么办呢？我需要在这个里边配置这个啊，嗯，只需要配置咱这个文案就可以了。然后他下边这个陈杰呢，是什么意思呢？这个是咱们自由组装的，例如说 我点击上门理发，我觉得我采集这个上门理发的时候，我还需要跟后台发送一些其他的业务数据字段，那我就可以在这里边直接进行绑定了啊， 这个字段值可以随意定的，是跟后端协商。好的，你可以叫 abc， 也叫 qwe 啊，都可以。嗯，但是这个字段是不能随便定义的，这是组间库内部的啊，他就叫奥莱曼的 text 啊。 然后下面这个是顾名思义，跟上面那个一样，上面那个是节点的采集，这个是对图片的采集，图片的采集话，这个字段 emay s r c 也是固定的啊，然后它后边的值就是对应的咱们那个图片的文件名，要包括后边的点后缀啊， 然后下边后边这个数据和这个是一样的啊，他都属于业务数据，业务自断可以随意搭配，比如这个他是一个一号岗位位置，我们来测试一下啊。 嗯，我们来测试一下，因为我们配置的收到格式数，所以说我们在采集的时候它会打印出来，如果是 force 它是不打印的啊。 然后我们点击跳转的时候，它会自动进行一个跳转，就是说页面它会自动采。 嗯，页面呢？配置它一般会采集一些白屏， d， n， s law 等以及白屏时间啊，然后这个 a law request 的这个是所有的资源进行加载， 如果这个资源加载完了，他就不再加载了。嗯，以及 position 定位啊，我们点击这个上门理发，上门摸他都有。嗯，进行打印啊，看他采用的数据，嗯， 采集时间，点击以及咱们的设备的宽度，宽高以及文案 id， 当前的页面以及定位以及分辨率和操作系统啊， 点击这个上门洗头，他是没反应的，因为咱没有配置来采集啊， 然后返回出去，嗯，然后我们刷新一下啊，当我们刷新的时候， 这个就是说刚才为什么那个是空的啊？因为咱们是刷新过光之前可以清的，首次进来他会当前页面，首次加载的时候，这个资源加载了哪些资源以及配置 效果啊？这页面所有的性能他都能采集到啊，性能的话对咱们的以后的项目的优化提升也是一个很关键的点啊。 而这个酷的话比较清亮级啊，只有大小只有四十 k b， 咱们下载完之后呢，它有一个 一个 diss 的，就是咱文件的主内容以及它的 user m d 文档，也就是咱的使 文档以及他这个产品的整个技术架构文档啊。如果说大家觉得这个组建库有显得地方做的不够好，想进行直接开发的话啊， 组建库的开发原码放到了给他哈补这个地址上，大家可以复合下来进行提交，然后将由我进行合并。如果 ok 的话啊，然后关于组建库的具体版本迭代更新会在就是公众号里边进行 具体发布啊，大家注意关注一下这个阿勇学前的这个公众号啊，关注公众号 好了，今天的推荐就到了这里，如果大家公司有相关的买点业务啊，还记得大家及时能够推荐下载即用啊，非常方便，拜拜！
23:11
04:36查看AI文稿AI文稿哈喽，各位观众朋友们大家好，那这一张呢，我们来定一下他这个类型，并且呢把这个叉克类给他初始画一下。 ok， 那么先默认导出一个类，那一个是 pose 的这个 divorce， 一个 class 为 chock。 ok， 我们把这个东西给他放大点啊，然后他接收一个 constructor， constructor 里面有一个 office， 那这个是用户传过来一个配置像， 那如果用户不传呢？我们需要给他做一个兜底逻辑，我们来一个 private 引力，他 defort 初始换一个默认的值，对，因为有些值并不是用户都需要传的。 ok， 然后我们来定一下他们的一些类型，然后我直接就把这个东西给他粘过来了， ok， 那就是这一坨，那这个 定义的是这个 dfotope， 深思就是我们这个默认纸里边都有些什么，那有这个 uid， 那他是做这个 uv 的，那到时候我们会详细讲一下。还有这个 requests uil， 那这个是上报的一个后台地址，还有这个 haztre， 这个 haztre 在我们做这个单页应用的时候，他一般有两种模式，一种是这个哈西，一种是这个 haztre， 你如果使用了这个 haztre， 你把它设置为处啊，他就会通过这个 haztre 监听自己会给你做这个上报的， 你如果使用的是哈心，你把它设置为处就可以了。 ok， 还有这个盗墓窗口，那就是我们这个一些，比如说这个点击事件啊，是否要上报？你可以把它 开启，还有这个 sdk 的版本，那是否要上报？还有这个用户可以自定一些参数啊，也可以做这个上报，那最后一个是这个 jca 肉，那比如说你有这个报 错啊？是否要上报？还有这个 pro miss 报错了啊？是否要上报？你也可以去开启他的一些选项。 ok， 所以说我们可以给他做一下导入。哎， 我们来一个 import the default options， 但是我们这个 options 并不是要接收这个 default options 是给这个默认值用的，对，我们是给他用的，我们要返回一个对象，而给他来个断言， ok， 然后可以把里边的一些东西给他去做一下这个填充，那有这个 history truck， 对，默认的话是不开启的，设置为 fouse， 还有这个哈西 truck， dom truck， 都给他设置成一个 fouse， 那还有这个， ok， 这些默认都是不开启的。那还有一个是这个 sdk 的莴笋，这个莴笋的话我们可以把它做成一个霉菌啊，也就这块，然后我直接把它粘过来了， ok， 然后我们在这导入一下这个东西 啊，直接付给他就可以了，然后点这个卧室， ok， 现在的版本是这个啊，一点零点零。 ok， 那这个 options 里面需要定什么呢？ options 里面其实定的东西跟这个是一样的，对，所以说我们可以再来一个樱桃 face， 那一个 prot， 一个 interface 叫这个 options， 然后他去继承一下这个底佛的 options， ok， 但是继承的时候需要加一个 party， 对，就这个， 因为它里边有些属性呢，它都是，呃，它都是这个非币填的，所以说我们就要加一个 party， 就是把这个变成这种啊问号的形式了，然后它只有一个需要币传，也就是这个 request cyl， 对，因为我们我们要明确这个用户的一个上报地址，我们可以把它改成一个， 也就是除了这个属性，其他的都是非币传的。 ok， 那这个的话就是我们需要用户来传的这个 options， 那么把这个类型定给他就可以了。然后用户传过来我们需要有一个值去做一个接收，这的话我们定一个接他，然后他的类型也就是这个 options， 然后我们在这给他 拖一下初始化，就等于这个凹不界的分裂啊三引，然后第一个是这个类似的人引力，他给 bot， 因为这是一个默认的纸，我们这个用户传过来的纸是要大于他的，所以说要把用户传过来纸给他放到后面， 因为后面的话会覆盖这个前面的。 ok， 那这样初始化的一些东西呢？我们就定定于完成了。下一张，我们来讲这个 pv， ok， 也就是配置 vivo。
27小满zs
04:25查看AI文稿AI文稿哈喽，各位观众朋友们大家好，那这一张呢，我们来讲一下这个到我们的上报，那到我们的上报，我们是主要给他是添加一个自定义属性，也就是这个他为的 t， 只要他携带这个自定义属性，我们就给他做这个上报。我们来看一个例子，就在这， 那如果我在这添加了这个涛哥的 k， 那他操作这个按钮的时候，我们就要把这些数据给他做一个上报，如果他没有添加的话，我们就不管了。 ok， 所以说我们可以可以根据这个思路来实现一个函数，我们先把需要监听一个事件先给他粘过来， ok， 那大概呢需要监听这么多，因为他可以对这个按钮做一个点击双击，还有这个右键啊，主要的划入，划出等等，所以说这些事件我们都要去监听，然后我们可以写到一个函数里边，让他去便利一下，帮我，让我问这点艾特伊恩特利利斯，那去帮我们做这个东西，然后我们给他起一个名叫 这个 target key report， ok， 然后我们把这个东西给他循环一下就可以了， 然后点这个防疫池，然后把里边便利的这些事件的都交给这个 爱的疑问他离死哪对，让他返回一个真正的疑问他，但是这个疑问他的话，他推断类型是错误的，他推断的是一个疑问他，但是这的话他应该是貌似疑问他，因为疑问他里面是没有办法去操作这个盖特吹 book， 所以说在这的话我们要给一个断言 啊，修正一下他这个类型，就是一点儿 target， 把它断言成一个元素就可以了，这个元素的话我们就可以操作这个 get tree beauty， 然后我们给他起个名叫 target key 吧 嘚儿 get 吹 beauty 叫这个 target key。 ok， 如果在这个元素上面能读到这个属性，那他绝对需要上榜，所以说我们在这可以判断一下，如果他没有这个属性，我们就不做任何操作了。 ok， 有这个属性我们还是吊，用这个 zs 点 repotechok， 对，然后需要上报一些东西，就是这个问题， 还有这个 chock key， 对，这个买点的一个关键字都给他上报上去。 ok， 然后我们就可以把这个东西加到这个判断里边了，如果用户 开启了这个选项，我们就给他座椅上面的一系列操作，就是这个 dom truck， ok， 然后把这个函数给他掉下就可以了。 ok， 那这样子就可以了，然后我们来试一下我们这个盗墓的上报，我们把它打个包。 ok， 然后我们用这个 atm， 然后给他预览一下。啊， 那现在我应该是 no 的服务没起，我把 no 的服务给大家起一下啊， 就我们上一张写的这个 no 的。 ok， 然后我们再试一下啊，看一下这个网络，然后我们点击这个按钮，那发现他已经做这个插口了，因为他里面监听了很多事件，像有这个点击，点击应该是触发了，我们来找 回家 啊，这是滑动，这是滑到那个上面的，还有这个是什么啊？这个鼠标抬起啊，鼠标问一下还有一些什么？鼠标抬起都会去出发的，那还有这个可利可这一堆 啊，然后这个鼠标一出，对，都会去给他做这个上报的，然后这个无添加的，我们来点一下， 对，无添加他是没有反应，像这个的话是有反应，有反应的，因为我们在这监听鼠标的这个移路，还有这个移出，还有这个点击摁下抬起，所以说他这会监听这个一堆， 但是这个疑问他的话我们是有区别的，所以说大家不用关心。对，通过这个疑问他我们可以区分出他这个事件。那我们来看后台有没有接收到，然后 后台的话其实也已经接收到了一大堆了。 ok。 然后后台的话我们可以根据这些，呃，这个疑问的传过来一个 k 啊，去做一个判断，他到底是点了，还是说划上去了，还是划出了啊？可以把这些买点数据给他统计起来。 ok。
2小满zs
00:16
10:42查看AI文稿AI文稿哈喽，大家好，我是方哥，今天来讲一个线上的 bug， 我们我们现在看一个问题啊，这一个页面，你看这个页面直接就卡死了， 然后鼠标也点不了了，相当于就整个系统就崩溃了，但是我在线下环境又是没问题的，那我们应该从什么维度去处理这个问题？到底是什么问题引起的呢？有些人可能会说 你线上环境和线下环境你可能请求的后台不一样，所以说我也把后台打开了，你看现在是九点三十八， 然后我比如说我真的去请求一下，而且任务 我们看一下日志，是吧？现在九点三十九，说明什么？他就说明我后台， 那就是说明我现在 localst， 我现在请求的也是线上的环境，然后我们再看下线上环境是不是也是请求的线上环境，也就是说我们至少保证我们请求的接口是一致的，我们登录的用户名是一致的， 也就是我们就可以说我们每次请求两个环境，每个接口返回的数据是一样的， 因为这个死了基本就用不了了，所以我关掉再重新的演演示一下代办任务，哎，就在代办任务这里点伴侣的时候，代办任务在这里点伴侣的时候就会出现 cars， 然后我们把这个清掉，我们再看一下办理，我们看着网络这已经卡死了。 然后我们看一下他所有的请求啊，我们来看一下他所有的请求，所有的请求使用他都是什么呀？ 返回了两百是吧？他请求他还是返回了？返回了是两百，有时候他可能会先等待所有请求你们响应都是没数据的，你看没一个有数据的，都是没数据，尽管这里啊，这里这个网络，这里调，这里看到是没数据， 但实际上他还是请有些数据已经请求回来的，不然这些数据怎么来的？他并不是上个月没带进来的，但这个也没有卡死了，我们会从什么角度去思考这个问题啊？为什么同样的代码 在线下环境是没问题的？在生产环境有问题？因为我是一名后端程序员，前端的话我一般只会原声的结石这些东西， 所以说我当时，嗯对这些，因为这个代码不是我写的，所以说我也不是太熟，我只是针对当前里面去处理， 然后我当时的思维里面开发环境是好的，生产环境不行，所以说我就想到环境问题，然后是找各种问题。什么嗯？是不是宽裕呀？因为我现在找 我的问题了，为什么同样的蛋白的生长环境不行？因为如果说我们原来说的跨越这些的话，他至少一般说他在这个， 在这个调试里面他他会去显示宽裕这个动作的，也就是会有提示的，说是也没提示，但是我也还也没找不到，找不到方法了我所以说我还去找宽裕这一种， 结果后面没找到问题，那后面没办法了，我又崩溃了。大家想一下，刚才看到我本地环境是没问题的， 所以说那我只有现场环境问题，所以说我当时我就每次去把本 本地环境到代码做了一个回退， 就是因为这个代码不是我写，他不是 get 版本吗？我就把你用到这这这个 get 版本，然后就回退，然后有十多个版本，然后我就是就像大家说的二分查找，我就一半半的就回退，结果回退到最后的源头上面， 第一次版本他都还有问题。那就是说最开始，最开始的时候啊，对于我们这个开发人员， 他在本地测试是没问题的，但是在现场都是有问题的，因为我们犯困没在没在现场去测试 搜索这个问题，最开始就一直没暴露，后面暴露出来之后本地没问题，现场有问题，这个问题暴 暴露出来之后他们也改，反正也试了很多方式，也不知道怎么去改没没改了，然后所以说弄得我这个后端程序员昨天搞了十二个小时，然后去处理。 我们知道任何一个问题你没有处理之前你都觉得比较难处理， 尤其是这种线下没问题，线上有问题他也不报错，因为如果说，比如说像我们这种，他因为卡纸他不报错，如果说报了个错误，是不是大家根据错误去处理比较容易处理点？他至少要报了个什么什么错误， 我根据提示去处理，因为在现场环境他直接就是卡死，当然我们也会想到是不是死循环之类的，你统一的代码为什么线上死循环，线下不死循环？所以说我的思维逻辑就一直定位在现场环境喽， 有有什么问题？昨天搞了十二个小时啊，后面才把这个问题搞定啊，因为后面实在搞不定的就是版本回退，一次次的回退，回退了之后还是不行， 然后我又去一行行的去看代码，因为代码逻辑也不是我写的，然后后面是无意中我在本地去测试的时候爆了一个错误，也可以跟大家演示一下，有些人肯定一定会说，怎么这么简单个问题都没没搞定是吧？ 那是因为我最开始的时候我就本地是好的，我就没想到要到本地去调，因为本地是好的。 大家看包了一个这个地规更新 h 超过了最大的地位更新了，史上就是个死循环。 h 在本地实际上已经是死循环了，但是他本地他不会崩溃，他在本地的话，你调试的时候他是不会崩溃的， 而在线上环境他不会有这种提示的，并且会崩溃， 那就说明什么呀？那就说明我们同样编写的代码，那是你在本地去运行或在线上去运行 还是是不一样的。哎，就是我们在开发版本的出现警告，控制台会有相应的提示，而生产版本不会有任何提示，使用的开发版本打开控制台会出现以下提示，哎，就是我们在开发版本的时候也就他的提示更多，并且这个容器应该是说会对我 我们做一做一些什么呀？比如说我们那个地规一直是循环，他可能就帮我们去处理啊，或者就直接跳出循环，而且生产环境就不会，他就一直一直那死循环了。所以说后面大家要去看一下我有一种开法包、生产包、拳击包的区别以及安装与法， 我们就不最主要是看到区别，你看他在这里在定义了是吗？开发包用于本地开发，使用上下不需要用的包标的不会被打入包内，跟使用于开发阶段提提供了额外的错误检查和警告， 也就是我们刚说的额外的错误和警告，方便开发找出并跟着错误，通常体积较大，因而包含了元代码和调试信息，对性能要求不高，主要关注点在于实现功能，修复 bug， 那也就是说明我们开 开发包和生产包它是有区别的。我们看一下生产包用于发布环节开发和上线后生产环境都使用的包，针对现在环境的优化，去除了开发阶段的警告和错误提示，所以说你在线上的时候他没有错误警告，就提示了，不好找问题了。 更小的体积，减少加载时代的用户体验，提供的更强大的心理优化啊。对于我这个后端程序啊，我就知道嘞，就是我们实际上我们在 开发包和生产包是不一样的，哎，就说你在开发环境，哎哎，运行到代码是好多，你到生产环境可能就不好，是有可能的，也就是我们就像我们现在今天遇到的这个问题。 然后后面的话我去看了他这个代码就是是一个自定义的主见，自定义的主见里面他写了很多的默契。 watch 就是监听节点，这里 watch fire 的历史的 word， 然后监听的时候执行，这里又是 watch form 的 word 的 id， 就是这个握起里面的东西和这个握起里面的东西。地规调用形成磁循环了，就是循环到这个附件这里循环这一块了， 来回循环呢？地规调用出现死机。所以说我把他贷款代码取消就好了，你看嘛，他这里他这个附件他就没循环出来，因为不是我自己写的代码，最开始位置都没找。对啊， 如果说我早看到这么多沃奇之类的东西，那我肯定可能就会判断他是不是死去吗？因为不是我写的代码，我也不知道我写的这些东西，如果自己写的代码可能要要查，这个问题要好查一下，因为不是我写的代码，然后我我也我也是后端困，对，前端现在什么 vue 这些一致 犯贱，所以说查问题，查查，搞了十二个小时才搞定，但是还是要像翻过这种啊，有一种锲而不舍的精神，不吃不喝，最后也要把这个问题搞定啊。最终还是把这个问题搞定了，因为我这个是想的是我线下没问题，线上有问题，所以说我当时就没想到还在线下去排查， 因为我线下没问题，我也排查个啥呀，这就是对原理性的东西不了解，你线下没问题并不意味着真的没问题，实际上他是有问题的，只是这个容器去帮你处理了， 找到问题的时候都是觉得简单，没找到问题之前就痛苦的一笔。因为昨天排查的过程还是比较漫长啊。这个你就这么解决了，大家应该从中也能学习到一些东西啊。
51立方.AI实战派
