© 2024. All rights reserved.

lighthouse-cli

載入效能：指標、測量、優化與監控

這篇文章會分享 Google 制定的 Web Vitals 效能指標與使用者體驗的關係與實際應用、如何在專案中利用模擬與實地的方式測量與監控，以及如何優化專案以提升效能與使用者體驗。

August 24, 2024 載入效能效能調校 Web Vitals 效能監控 Lighthouse Core Web Vitals Loading Performance Chrome DevTools RAIL Real User Monitoring Sentry Datadog Synthetic Monitoring active monitoring lighthouse-cli passive monitoring sharing 前端效能系列文加載效能 · 留言

利用 Cypress 和 Sentry 測試前端效能

在自動化測試前端效能時，可能會考慮的解法有：(1) Lighthouse CI Action 或 web-vitals library + 丟到某個地方做資料儲存和 dashboard；另一個解法是 (2) 利用 Cypress + Sentry 來取得相關資訊並做呈現。這篇文章會針對 Cypress + Sentry 這個解法做說明，並比較兩種解法。

July 11, 2023 Sentry Cypress End-to-End Testing GitHub Actions Lighthouse Loading Performance Rendering Performance Synthetic Monitoring active monitoring Web Vitals Memori 轉譯效能加載效能效能監控效能調校 CI/CD Core Web Vitals cypress.io lighthouse-cli 端對端測試自動化測試前端效能系列文 · 留言

打造高速網站，從網站指標開始！(Speed Up Your App with Web Vitals) MOPCON 2021 逐字稿

MOPCON 逐字稿

October 24, 2021 MOPCON Web Vitals 打造高速網站，從網站指標開始！全方位提升使用者體驗與流量的關鍵 Core Web Vitals SEO 搜尋引擎優化效能調校 Firebase Performance Firebase Image Optimization Lighthouse Loading Performance lighthouse-cli sharing 加載效能圖片最佳化趨勢科技 Trend Micro Real User Monitoring Synthetic Monitoring Mixtini 前端效能系列文 · 留言

利用 Lighthouse 與 Puppeteer 對全站網頁做效能檢測並產生報表

本文主要是記錄如何在專案中簡易下指令來自動執行 Lighthouse 與 Puppeteer 做全站網頁的效能檢測、產生報表與其目錄。

August 21, 2020 Lighthouse Puppeteer End-to-End Testing 端對端測試 lighthouse-cli 自動化測試效能調校吃什麼前端效能系列文 · 留言