資訊專欄INFORMATION COLUMN
摘要：主流埋點方案目前主流的埋點方案包括代碼埋點可視化埋點無埋點一代碼埋點在需要埋點的節(jié)點調(diào)用接口，攜帶數(shù)據(jù)上傳。二可視化埋點通過可視化交互的手段，代替代碼埋點。也就是用一個系統(tǒng)來實現(xiàn)手動插入代碼埋點的過程。
主流埋點方案
目前主流的埋點方案包括
代碼埋點
可視化埋點
無埋點
? 在需要埋點的節(jié)點調(diào)用接口，攜帶數(shù)據(jù)上傳。如百度統(tǒng)計等；
? 缺點
? 工作量較大，每一個組件的埋點都需要添加相應(yīng)的代碼，入侵業(yè)務(wù)代碼，增加項目復雜度。
? 通過可視化交互的手段，代替代碼埋點。將業(yè)務(wù)代碼和埋點代碼分離，提供一個可視化交互的頁面，輸入為業(yè)務(wù)代碼，通過這個可視化系統(tǒng)，可以在業(yè)務(wù)代碼中自定義的增加埋點事件等等，最后輸出的代碼耦合了業(yè)務(wù)代碼和埋點代碼。
? 可視化埋點聽起來比較高大上，實際上跟代碼埋點還是區(qū)別不大。也就是用一個系統(tǒng)來實現(xiàn)手動插入代碼埋點的過程。
? 缺點:
? 業(yè)務(wù)屬性數(shù)據(jù)，例如，訂單號、金額、商品數(shù)據(jù)量等，通常要調(diào)用后臺的接口，可視化埋點在這方面的支持有限；
? 需要借助第三方工具實現(xiàn)。
無埋點并不是說不需要埋點，而是全部埋點，前端的任意一個事件都被綁定一個標識，所有的事件都別記錄下來。通過定期上傳記錄文件，配合文件解析，解析出來我們想要的數(shù)據(jù)，并生成可視化報告供專業(yè)人員分析因此實現(xiàn)“無埋點”統(tǒng)計。
? 缺點
? 無法靈活的定制各個事件所需要上傳的數(shù)據(jù)
? 無埋點采集全量數(shù)據(jù)，給數(shù)據(jù)傳輸和服務(wù)器增加壓力
代碼埋點分類? 代碼埋點分為 命令式埋點和聲明式埋點
? 顧名思義，開發(fā)者需要手動在需要埋點的節(jié)點處進行埋點。如點擊按鈕或鏈接后的回調(diào)函數(shù)、頁面ready時進行請求的發(fā)送。大家肯定都很熟悉這樣的代碼：
// 頁面加載時發(fā)送埋點請求
$(document).ready(function(){
// ... 這里存在一些業(yè)務(wù)邏輯
sendRequest(params);
});
// 按鈕點擊時發(fā)送埋點請求
$("button").click(function(){
// ... 這里存在一些業(yè)務(wù)邏輯
sendRequest(params);
});
? 聲明式埋點對命令式埋點做了改進，將埋點的代碼與具體的業(yè)務(wù)邏輯解耦。從而提高埋點的效率和代碼的可維護性。代碼如下:
// key表示埋點的唯一標識；act表示埋點方式
? 因為項目采用Vue框架，所以使用Vue中的自定義指令完成聲明式埋點。
Vue.directive("log", {
bind( el, binding ){
el.addEventListener("click", ()=>{
Axios.post
})
}
});
? 只需要在需要記錄的組件中配置使用v-log指令，加上詳情參數(shù)就可以完成用戶軌跡記錄。如下:
// caption表示埋點的模塊；paras表示用戶的行為
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/102425.html
獲取用戶的交互習慣及喜好，進一步提升轉(zhuǎn)化率，可以在之前的埋點方案實現(xiàn)中，都是在具體的按鈕或者圖片被點擊或者被曝光時主動通過事件去上報埋點。但這種方法適合在埋點比較少時還行的項目，遇見項目中需要大量埋點時，添加的代碼就太多了，就會埋點邏輯與業(yè)務(wù)邏輯的高耦合。 由此需要換種方式。我先給大家普及下埋點上報方式都有哪些？ 手動埋點 可視化埋點 無痕埋點 手動埋點，顧名思義就是純手動寫代碼，調(diào)...
摘要：項目架構(gòu)項目目錄項目目錄是采用自動生成，其它按需自己新建就好了。 項目架構(gòu) 項目目錄 ├── build ├── config ├── dist │?? └── static │?? ├── css │?? ├── fonts │?? ├── images │?? ├── js │?? └── lib ├── src │?? ├── api │?...
摘要：項目架構(gòu)項目目錄項目目錄是采用自動生成，其它按需自己新建就好了。 項目架構(gòu) 項目目錄 ├── build ├── config ├── dist │?? └── static │?? ├── css │?? ├── fonts │?? ├── images │?? ├── js │?? └── lib ├── src │?? ├── api │?...
閱讀 1412·2019-08-30 12:54
閱讀 1895·2019-08-30 11:16
閱讀 1642·2019-08-30 10:50
閱讀 2478·2019-08-29 16:17
閱讀 1296·2019-08-26 12:17
閱讀 1404·2019-08-26 10:15
閱讀 2412·2019-08-23 18:38
閱讀 808·2019-08-23 17:50
