歡迎您光臨本站 註冊首頁

Keepfast v0.2.1 釋出,前端效能分析工具

←手機掃碼閱讀     admin @ 2020-06-22 , reply:0

Keepfast v0.2.1 釋出了,Keepfast 是一個效能分析工具,能夠分析網站的資源構建效能和頁面效能,生成效能報告並提供最佳化建議,讓效能監控更方便。目前已用在碼雲內部為前端專案提供效能監控支援。

這是第一個公開發行版,以下做些簡單的介紹。

主要特性

  • 分析並生成構建效能報告,可直觀的對比兩個版本的構建效能,以便儘早發現構建效能問題
  • 基於 Lighthouse 對網站進行效能測試,給出各方面效能指標和相關建議
  • 預置 Gitee API 支援,能夠在 Gitee 倉庫中有新的提交時為其生成一個效能報告,隨時跟蹤效能指標和得分

效果預覽

訪問此頁面可檢視效能報告效果:

https://gitee.com/gitee-frontend/keepfast/commit/9280cacb70b54ccdadf1e5905667ab48945cd144#note_2724556

安裝


 npm install -g lighthouse @gitee/keepfast

使用

建立配置檔案

先為你的專案建立配置檔案:


 # 進入你的專案目錄
 cd /path/to/your/repo
 
 # 初始化配置檔案
 keepfast init

然後修改 keepfast.config.js 配置檔案,完善 repository 欄位資訊,如果你的專案是由 Vue CLI 建立和管理的,剩下的配置內容保持原樣即可。

生成報告

執行效能測試並將報告輸出到 ./report.json 檔案中:


 keepfast report ./report.json

上傳報告

上傳報告會呼叫 Gitee API,為了讓 keepfast 有許可權操作你的倉庫,你需要提供一個私人令牌,它可在設定 > 私人令牌 頁面中生成,生成後執行以下命令新增環境變數:


 export GITEE_API_ACCESS_TOKEN=你的私人令牌

之後執行以下命令上傳報告:


 keepfast upload ./report.json

如果當前分支已有對應的 Pull Request,則會將報告上傳到該 Pull Request 的評論中,否則上傳到當前 Commit 詳情頁的評論中。

在 Gitee Go 中使用

Gitee Go 是 Gitee 推出的 CI/CD(持續構建與整合)服務,使用者可以透過自定義構建流程,實現構建整合自動化。

在你的倉庫的 master 分支上新建流水線檔案,使用如下配置:


 name: keepfast
 displayName: keepfast
 triggers:
   push:
     branches:
       - master
       - develop
 steps:
   - step: npmbuild@1
     name: npm-build
     displayName: npm-build
     inputs:
       nodeVersion: 12.7
       goals: >-
             yum clean all
 
             yum install -y epel-release
 
             yum -y update
 
             yum install -y chromium
 
             npm config set registry https://registry.npm.taobao.org
 
             export GITEE_API_ACCESS_TOKEN=你的私人令牌
 
             export SASS_BINARY_SITE=https://npm.taobao.org/mirrors/node-sass/
 
             npm install
 
             npm install -g lighthouse @gitee/keepfast
 
             keepfast report ./report.json
 
             keepfast upload ./report.json

目前 Gitee Go 還不支援在網頁端設定環境變數,你需要手動將私人令牌寫到配置檔案中,但這種做法存在安全性問題,請等待 Gitee Go 的後續更新。

常見問題

為什麼我要選擇 Keepfast,而不是 lighthouse-ci 等之類的工具?

如果你符合以下條件則可以試試 Keepfast。

  • 有多個長期開發的前端專案,對它們的構建效能和頁面載入效能有較高的要求,需要自動化進行效能監控
  • 是 Gitee 企業版付費使用者,且前端專案都託管在 GItee 上,需要一個能在 Gitee Go 服務中使用的效能監控工具
  • 懶得花時間去調研和體驗同類工具,用 Keepfast 你只需要照著文件複製貼上跑命令即可快速體驗

跟 xxxx 比起來功能太少了!

如果你對效能分析這方面有不錯的想法和建議,可以反饋給我們


[admin ]

來源:OsChina
連結:https://www.oschina.net/news/116617/keepfast-0-2-1-released
Keepfast v0.2.1 釋出,前端效能分析工具已經有309次圍觀

http://coctec.com/news/all/show-post-239436.html