你以為 Grafana 只是後端或 DevOps/SRE 的專屬工具?其實,這個集監控、可觀測性以及數據視覺化於一身的工具與『前端』息息相關。前端工程師不僅可以藉由 Grafana 進行應用程式開發,還能滿足需求越來越高的前端監控。在本系列文章中,我將深入介紹如何利用 Grafana Scenes 打造高度客製的 Grafana App,並結合 Grafana Faro 進行前端效能監控,打破你對 Grafana 的既有認知,讓我們一起探索 Grafana 在前端世界中的無限可能!
前言 在前端服務中如果要取得數據資料,勢必需要向後端服務發起 HTTP 請求,在 Grafana Scenes 中也是相同道理,而取得的資料即為 Dataso...
前言 在 Grafana 中,Dashboard 可能包含了多種查詢結果的 Panel。這些查詢的屬性通常非常複雜,且其可能的值無法一一列舉。在許多情況下,當...
前言 在前面的篇章中,我們從 Plugin 的初始化設置、時間範圍及變數設定到數據資料的取得,這一系列的資料收集方法即是為了視覺化的呈現,所以本章節會介紹圖表...
前言 雖然經由前面的章節已經可以形成一個完整的 Panel 或 Dashboard,但很多時候我們真正使用的資料數據經過一系列的 query filter 還...
前言 在先前的文章中我們接觸過了許多 Dashboard 或是 Panel 上的 control 元件,包括 Variables 的下拉選單、TimeRang...
前言 為了讓開發者可以處理更複雜的視覺化呈現,本篇文章將介紹 Grafana 的一些進階功能。首先,我們會介紹 addActivationHandler 函數...
前言 在前面的章節中,我們已經深入了解了 Grafana Scene 的基本使用方法和非常實用的進階功能,下一步就是藉由基本功能的概念與進階功能結合實現一個完...
前言 在上一章中,我們已經建立了自定義的 Scene、Variable 和 Control。本章將了解在不使用 SceneQueryRunner 的情況下,如...
前言 在軟體開發領域中,我們經常聽到 DevOps、SRE 或後端團隊需要監控服務運行狀況、系統流量和資源使用量等。這種監控或可觀測性通常涵蓋從請求到達伺服器...
前言 既然我們有監控前端應用程式的需求,是因為我們需要知道我們的網站是否能夠提供良好的使用者體驗,其中佔比最大的就是效能問題。而我們可能都了解過效能需要如何改...