由 http://www.fullstackoptimization.com/ 與 https://die-antwort.eu/ 合作開發
Chrome 應用程式商店:https://chrome.google.com/webstore/detail/f19n-obstrusive-live-test/jbnaibigcohjfefpfocphcjeliohhold?hl=en
使用者 doku:https://docs.google.com/document/d/1UktjtxNe71vPKvw_D4xELX2RMJAXXI4-hrMC7Pinb6U ← ?
之前廣為人知的廣告「f19n Obtrusive Live Test」…新名字沒那麼嚇人了! (這不是一個可怕的應用程序,這是一個很棒的應用程式!)
它是一個沙盒、可擴展的即時測試 Chrome 擴充功能和框架!它在您訪問的每個頁面上運行預訂和自訂測試,並提供直接的視覺回饋。
目前它有多個針對 SEO、網路效能和社群媒體最佳實踐的預定義規則。
此擴充功能收集物件中頁面載入的整個生命週期(http-headers、onpageload、onDOMready...),然後針對該物件執行 javascript 函數並傳回測試回饋。
請參閱 /src/public/default-rules 以取得目前預設測試內容的清單。所有規則都可以檢查、停用/啟用。定期新增的預設規則。
請參閱 /sample-rules/sample.page-object-25112017.json 以了解收集了頁面載入生命週期的哪些資料。
一切!您可以編寫自己的測試!在頁面載入和渲染生命週期期間瀏覽器中發生的任何事情都可以被檢查和剖析!
此外,它還可以從這些規則中呼叫第三方 REST-API。甚至忽略 CORS 標頭或正常的獲取限制。
您也可以透過 fetch 取得普通頁面和其他資源。即:在一個頁面上執行的規則可以取得同一網域或其他第三方網域的其他 URL。請參閱 /default-rules/robotstxt-googlebot-url-check-v2.js 以了解取得網域的 robots.txt 的規則,然後測試目前測試的 URL 是否允許/禁止。
請參閱谷歌文檔
要開發自己的規則,您只需透過 Chrome 應用程式商店安裝擴充功能即可。
如果你想深入挖掘,我們可以複製這個代表。進而:
npm install
執行建置過程一次(為此,您需要安裝 grunt-cli npm install -g grunt-cli
)。它將監視更改的檔案並在必要時自動重新載入擴充功能。
grunt
開啟 chrome://extensions/ 並將解壓縮擴充功能的安裝指向 ./build 資料夾。
執行以下命令來建立可用於生產的 zip 存檔,該存檔可以上傳到 Google 擴充儀表板。
grunt dist
存檔將儲存到/dist/export.zip
。
生產就緒規則可以在 /src/public/default-rules 找到
/sample-rules 裡面有一些範例規則以及如何寫自己的規則的文件。然後可以在擴充功能的設定頁面上將規則新增到您的應用程式中。
請參閱 /sample-rules/debug-hello-world.js 以了解一個非常簡單的起點(以及 /sample-rules/debug-hello-world-with-comments.js 以了解一些解釋)
另外 /sample-rules/debug-stringify-page-object.js 為您提供了一種簡單的方法來檢查您訪問的每個頁面的頁面物件(收集的有關頁面生命週期的資訊)。
此儲存庫中的所有其他程式碼(如果沒有另外定義)目前可在
貢獻許可證。
歡迎您來到
目前沒有
這些限制不適用於 /sample-rules/ 和 /public/default-rules/ 程式碼。
該許可證將來可能會發生變化。我必須弄清楚該產品的最佳長期許可是什麼。
權利持有者:Franz Enzenhofer fe at f19n dot com