sharing

從零打造前端效能監控系統 | WebConf Taiwan 2023 逐字稿

從零打造前端效能監控系統 | WebConf Taiwan 2023 逐字稿

Sentry Cypress Web Vitals Memori Loading Performance Rendering Performance Core Web Vitals 效能監控 Real User Monitoring GitHub Actions CI/CD Chrome DevTools End-to-End Testing Google Analytics Lighthouse Synthetic Monitoring active monitoring cypress.io passive monitoring 加載效能 效能調校 端對端測試 自動化測試 轉譯效能 sharing WebConf Taiwan 前端效能 系列文 · 留言


利用 React Context API + useReducer 實作 Redux

要選 Redux 還是 context API + useReducer 來做狀態管理呢?context API + useReducer 能完全取代 Redux 嗎?

react hooks react.js redux Web Vitals Loading Performance Rendering Performance front-end architecture Core Web Vitals 加載效能 效能調校 sharing · 留言


Visual Testing | MOPCON 2022 逐字稿

「Visual Testing」MOPCON 2022 逐字稿,歡迎搭配投影片與範例一同服用。

visual testing Storybook Percy MOPCON Mixtini Cypress Chromatic 自動化測試 打造高速網站,從網站指標開始!全方位提升使用者體驗與流量的關鍵 視覺測試 visual regression testing Unit Test Jest Integration Test GitHub Actions GitHub End-to-End Testing cypress.io CI/CD 端對端測試 整合測試 單元測試 趨勢科技 Trend Micro pull request sharing · 留言


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

MOPCON 逐字稿

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 前端效能 系列文 · 留言


Tipping Point Front-End Case Study and Practice: CSS

Tipping Point Front-End Case Study and Practice: CSS

styled-system styled-components Tonic Styled UI CSS Modules CSS in JS BEM css Modern Web Loading Performance Responsive Web Design 響應式網頁 加載效能 趨勢科技 Trend Micro sharing · 留言


91 Unit Testing 單元測試實戰操練營 筆記 - 寫測試的正確姿勢

參加 91 Unit Testing 單元測試實戰操練營的簡單筆記。

單元測試 自動化測試 Jest Unit Test front end testing 趨勢科技 Trend Micro sharing · 留言


Lighthouse Metrics:以使用者為出發點來探討效能的指標

本文說明 Lighthouse 以使用者為出發點來探討效能的指標。

Lighthouse RAIL Web Vitals 效能調校 Core Web Vitals Loading Performance 加載效能 sharing Synthetic Monitoring active monitoring Real User Monitoring passive monitoring 趨勢科技 Trend Micro 前端效能 系列文 · 留言


Start your app the better way with Styled System

本文主要由此投影片「Start your app the better way with Styled System」之講稿改寫。本文會從 CSS 歷史開始談起,接著會來看過去我們在使用元件庫上遇到的問題,以及怎麼使用 Styled System 來解決這些問題。

styled-system styled-components CSS Modules CSS in JS BEM css End-to-End Testing 端對端測試 Media Query Modern Web Loading Performance Responsive Web Design react.js webpack 自動化測試 響應式網頁 加載效能 sharing · 留言


利用 Styled System 建立一個更好的 UI 元件庫!

利用 Styled System 建立一個更好的 UI 元件庫!

styled-system styled-components CSS Modules CSS in JS OOCSS BEM SMACSS css Bootstrap Critical Rendering Path End-to-End Testing 端對端測試 Loading Performance Media Query Modern Web Rendering Performance Responsive Web Design react.js webpack 加載效能 效能調校 自動化測試 轉譯效能 關鍵轉譯路徑 響應式網頁 sharing 趨勢科技 Trend Micro · 留言


React Form: Redux Form vs React Final Form vs Formik and Yup

本文會先從為何要做表單狀態管理說起,接著看目前市面上有哪些好的表單函式庫和條列挑選原則,並探討三個表單函式庫 Redux Form、React Final Form、Formik & Yup,最後做比較和總結。

react.js form react.js redux virtual dom sharing · 留言


Nightwatch101:手牽手一起來學 Nightwatch!

本篇文章主要是將去年底今年初參加「2018 iT 邦幫忙鐵人賽」與後續在 VueJS 台灣 meetup 201803@五倍紅寶石所分享的文件做收納整理。

Nightwatch 自動化測試 End-to-End Testing 端對端測試 Selenium Selenium WebDriver 鐵人賽 2018鐵人賽 sharing Nightwatch101 Nightwatch101 2018 iT 邦幫忙鐵人賽 系列文 · 留言


搜尋引擎優化指南 (SEO Guideline) - 如何有系統的優化網站、評估與持續改進?

這篇文章將我到目前為止的 SEO 相關操作整理為搜尋引擎優化指南 (SEO Guideline),它是一套針對搜尋引擎優化網站的執行準則,每個崗位執行特定的工作即可讓網站有一定的效果,並且這樣的優化過程是可以被評估、回饋與持續改進的;而系統化的實行也有助於將有限資源做最大利用,以得到最好的效果,例如:提高點閱率、排名等。

SEO sitemap RSS structured data social meta tags rich snippets 資訊架構 標籤系統 關鍵字經營 複合式摘要 結構化資料 social plugin sharing 搜尋引擎優化 SEO101 · 留言