Flutter 框架推出至今,已經(jīng)在超過 50萬個(gè)應(yīng)用中使用,從 2019 年到現(xiàn)在一直保持著強(qiáng)勁的增長趨勢。優(yōu)秀的性能、跨平臺能力和活躍的技術(shù)社區(qū)使得其愈發(fā)受到廣大開發(fā)者的青睞。
而隨著 Flutter 的普及和廣泛應(yīng)用,越來越多的企業(yè)和開發(fā)者對自動(dòng)高效的埋點(diǎn)提出了更高要求,對于承接大量埋點(diǎn)需求的 Flutter 框架開發(fā)者而言,這無疑是一個(gè)棘手的難題:Flutter 官方并沒有提供相應(yīng)的 AOP(Aspect Oriented Programming,面向切面編程),也就無法提供統(tǒng)一標(biāo)準(zhǔn)的邏輯用于簡化埋點(diǎn)流程,導(dǎo)致埋點(diǎn)成本很高,大量的埋點(diǎn)需求無法及時(shí)響應(yīng)。
目前,業(yè)內(nèi)可視化全埋點(diǎn)大多只支持 Web 或 App 原生埋點(diǎn)。針對 Flutter 開發(fā)者的痛點(diǎn),神策的可視化全埋點(diǎn)繼支持 Web、App、React Native 等框架后,繼續(xù)突破創(chuàng)新,專項(xiàng)技術(shù)攻關(guān),最終全面支持 Flutter 框架。開發(fā)者可以通過可視化的方式定義事件,僅需三步就可以合規(guī)采集頁面任意可見元素內(nèi)容作為事件屬性,同時(shí)快速驗(yàn)證可視化自定義屬性埋點(diǎn)數(shù)據(jù)是否正確。
關(guān)注神策數(shù)據(jù)公眾號,查看神策可視化全埋點(diǎn)更多能力解讀。
三大突破
快速響應(yīng)Flutter平臺的埋點(diǎn)需求
一、可視化升級,為提升埋點(diǎn)效率加碼
神策在突破 Flutter 全埋點(diǎn)的基礎(chǔ)上,結(jié)合可視化全埋點(diǎn)的業(yè)務(wù)邏輯,實(shí)現(xiàn)了 Flutter 可視化全埋點(diǎn)。廣泛支持 Flutter 可點(diǎn)擊控件,并針對不同的業(yè)務(wù)場景,支持多維度的埋點(diǎn)需求。
1.支持可點(diǎn)擊元素
在 Flutter 框架中可點(diǎn)擊的元素,本質(zhì)上是 GestureDetector,針對 GestureDetector 實(shí)現(xiàn)的元素點(diǎn)擊均支持可視化全埋點(diǎn),比如常見的 TextButton、Switch、Radio 等元素。除此之外,還可以支持 Flutter 內(nèi)嵌 H5 可點(diǎn)擊元素,實(shí)現(xiàn)不同場景下的埋點(diǎn)需求。
2.支持列表、多級列表等復(fù)雜的場景
Flutter 中的 ListView 和 GridView 兩類元素被處理成列表元素,針對列表元素,支持限制「元素位置」定義事件,從而避免相似內(nèi)容多次重復(fù)定義事件,提高了埋點(diǎn)效率。如下圖所示:
圖 神策可視化全埋點(diǎn)功能截圖示例
同時(shí),神策可視化全埋點(diǎn)還支持限制「元素內(nèi)容」定義事件,從而針對元素內(nèi)容可能發(fā)生變化的情況,滿足可配置的個(gè)性化埋點(diǎn)需求,覆蓋更多分析場景。
二、定義屬性,屬性采集所見即所得
1.支持自定義屬性
支持開發(fā)者通過可視化的方式,采集頁面任何可見元素內(nèi)容作為事件屬性,大幅度拓展可視化全埋點(diǎn)的應(yīng)用場景,降低接入門檻,提高埋點(diǎn)效率。同時(shí),文本內(nèi)容支持多種不同的處理規(guī)則,還可以自定義正則表達(dá)式解析內(nèi)容。
圖 神策可視化全埋點(diǎn)功能截圖示例
2.支持埋點(diǎn)校驗(yàn)
埋點(diǎn)校驗(yàn)功能支持開發(fā)者通過當(dāng)前手機(jī)點(diǎn)擊定義的元素,實(shí)時(shí)上報(bào)合規(guī)采集的全埋點(diǎn)事件和自定義屬性,業(yè)務(wù)人員一人就可以獨(dú)立完成埋點(diǎn)、測試、上線的全過程,省去前后溝通的時(shí)間,顯著提升工作效率,降低開發(fā)依賴。
圖 神策可視化全埋點(diǎn)功能截圖示例
三、致力于為開發(fā)者帶來極致體驗(yàn)
1.集成簡單
集成簡單,方便客戶快速體驗(yàn),大大降低客戶接入門檻。下載并執(zhí)行腳本,再引入相關(guān)模塊,即可快速集成 Flutter 全埋點(diǎn) SDK,通過初始化開關(guān)配置即可開啟可視化全埋點(diǎn)功能。
2.定義事件精準(zhǔn)匹配
在 Flutter 開發(fā)者進(jìn)行埋點(diǎn)的過程中,可能會面臨的問題是,一個(gè)元素由多個(gè) Widget 組成,在查找元素路徑時(shí)需要一直向上遞歸查找直到根節(jié)點(diǎn)位置,往往造就了極為冗長的元素標(biāo)識路徑,這為開發(fā)者對不同元素的識別帶來了巨大挑戰(zhàn)。
而通過神策可視化全埋點(diǎn),在 Flutter 中可以篩選開發(fā)者自己項(xiàng)目中創(chuàng)建的 Widget,元素路徑也只采用項(xiàng)目中定義的 Widget 組成,從而實(shí)現(xiàn)元素路徑構(gòu)建的優(yōu)化。優(yōu)化后的路徑更加簡單清晰,也更準(zhǔn)確標(biāo)識 App 中的某個(gè)元素,從而實(shí)現(xiàn)事件定義和屬性采集的精準(zhǔn)匹配。
3.性能優(yōu)越
在掃碼連接可視化全埋點(diǎn)階段,SDK 會進(jìn)行元素遍歷,以實(shí)現(xiàn)上傳頁面元素信息。在 Flutter 框架中,一切皆由 Widget 組成,并且項(xiàng)目中各種元素也會包含大量系統(tǒng)自動(dòng)創(chuàng)建的 Widget,直接遍歷可能導(dǎo)致 App 頁面卡頓,影響用戶體驗(yàn)。
神策 SDK 在元素遍歷過程中,從 Flutter 實(shí)現(xiàn)原理著手,只遍歷項(xiàng)目創(chuàng)建的元素和可視化需要用到的關(guān)鍵元素,忽略系統(tǒng)自動(dòng)創(chuàng)建的各種 Widget,從而極大地優(yōu)化了遍歷性能,提升元素信息上傳速度。神策針對 Flutter 界面刷新機(jī)制也做了專門的優(yōu)化,實(shí)現(xiàn)了只有頁面發(fā)生變化才會遍歷更新頁面元素信息,確保用戶無感知的使用體驗(yàn)。即使面對復(fù)雜的商業(yè)項(xiàng)目 App,我們的元素遍歷也不會造成頁面卡頓,為用戶帶來更佳的使用體驗(yàn)。
對于廣大 Flutter 跨平臺框架開發(fā)者來說,神策的 Flutter 可視化全埋點(diǎn)為埋點(diǎn)設(shè)計(jì)提供了另一種模式,可以讓開發(fā)者更快速地響應(yīng)業(yè)務(wù)側(cè)的埋點(diǎn)需求,提升整改團(tuán)隊(duì)的開發(fā)效率。
關(guān)注神策數(shù)據(jù)公眾號,查看神策可視化全埋點(diǎn)更多能力解讀。
