阿里UC百億PV的前端監控平臺:（1）概述

本文首發於知乎 《阿里UC百億級PV的前端監控平臺實踐》 ，搬運轉載請註明出處，不然追究版權責任。

阿里UC百億PV的嶽鷹全景監控平臺實踐 系列文章：

• 阿里UC百億PV的前端監控平臺:（1）概述
• 阿里UC百億PV的前端監控平臺:（2）前端採集上報
• 阿里UC百億PV的前端監控平臺:（3）日誌存儲
• 阿里UC百億PV的前端監控平臺:（4）大數據分析
• 阿里UC百億PV的前端監控平臺:（5）數據可視化

前言

Web承載的業務愈來愈複雜，用戶對於Web的體驗要求也愈來愈高，Web性能的優劣對業務收益也有着很是直接的影響。

本文主要介紹阿里UC百億級PV前端監控平臺， 嶽鷹全景監控平臺 的實踐歷程 - 概述，閱讀時長 10 分鐘。

爲何要打造前端監控系統？

前端的開發環境比較複雜，頁面在不一樣瀏覽器、微信等APP均可能展示不一樣，用戶的網絡網速、手機性能等，也會影響頁面訪問速度。在移動端可能更爲明顯，移動端用戶對頁面響應延遲、頁面沒法使用的容忍度更低。

這些都有可能影響用戶體驗，從而致使業務訪問量降低、用戶流失等問題。

前端頁面對用戶體驗和業務收益的重要性不言而喻。這也是咱們打造前端監控系統的初衷，但願達到如下3點效果。

• 獲取用戶的使用產品的相關數據和體驗
• 當前端頁面出現異常時，能第一時間通知到研發負責人，定位和解決問題，及時止損
• 獲取用戶使用產品的真實體驗，並以監控數據爲基礎，指導頁面的優化方向。

前端監控包括哪些內容，如何打造？

通常而言，一個監控系統大體包括四個階段：日誌採集上報、日誌存儲、統計與分析、數據展現。 後續會從這 4個階段展開闡述嶽鷹前端監控平臺的實踐過程。

• 採集上報

收集性能和異常日誌，在本地作必定的處理過濾等，將數據上報到服務器。

• 日誌存儲

後端接收前端上報日誌後會鑑權、過濾、清洗後存儲入庫，用於用戶查看分析問題；通常選擇搜索數據庫和時序數據庫。

• 統計分析

經過預設的條件和規則，對存儲的日誌信息進行統計和篩選，用於用戶進一步的分析規律找到問題根因。

• 數據展現

經過提供一個可視化的數據面板，讓用戶能夠看到統計趨勢數據和具體日誌信息，提供豐富的分析、對比、OLAP，更快速的定位和解決問題。

嶽鷹-WEB前端監控

阿里UC出品的 嶽鷹全景監控平臺 ，支持移動H五、PC站點、微信小程序以及支付寶小程序等各家小程序，PV、JS異常、頁面性能等監控指標完整，已經對外開放，歡迎免費體驗試用。

技術交流、第一時間掌握產品動態，歡迎聯繫微信小助手～

參考資料

• 評估關鍵渲染路徑
• 移動WEB應用路線圖-性能和調優
• 前端異常處理
• 監聽AJAX請求
• 【前端3分鐘】Script Error產生的緣由和解法