What is the Concept of Optimistic UI?
The longer the wait, the more likely users will drop off. Optimistic UI emphasizes immediate, optimistic feedback.
The longer the wait, the more likely users will drop off. Optimistic UI emphasizes immediate, optimistic feedback.
不要让使用者等待！越多的等待时间，就越容易让使用者流失，因此让应用程式的回馈即时，是很基础重要的原则。 Optimistic UI 强调即时、乐观的使用者介面回馈。在用户触发操作后，系统即时假定成功，迅速更新介面，提升使用者体验。这种方法有效缩短用户等待时间，创造更流畅、令人满意的互动体验。
不要让使用者等待！越多的等待时间，就越容易让使用者流失，因此让应用程式的回馈即时，是很基础重要的原则。 Optimistic UI 强调即时、乐观的使用者介面回馈。在用户触发操作后，系统即时假定成功，迅速更新介面，提升使用者体验。这种方法有效缩短用户等待时间，创造更流畅、令人满意的互动体验。
How many sizes of web pages do I need to create? Share why you should use fewer breakpoints to create a responsive web page.
我既设计网页也开发网页，并且在过去几年经验中总结发现设计与开发配合上容易遇到的问题像是：我需要绘制多少种尺寸的网页？我需要为网页设置多少个断点？这篇文章我分享自己作为设计者与开发者的经历以及你为何应该使用越少的断点来制作响应式网页越好。
我既設計網頁也開發網頁，並且在過去幾年經驗中總結發現設計與開發配合上容易遇到的問題像是：我需要繪製多少種尺寸的網頁？我需要替網頁設置多少個斷點？這篇文章我分享自己身為設計者與開發者的經歷以及你為何應該使用越少的斷點來製作響應式網頁越好。
By giving web elements relative relationships instead of absolute values. Using CSS Variables for relative `z-index` values, which is an elegant method!
赋予网页元素相对的关系而非绝对的数值，让我们强烈联系元素之间的差异，而非取决于某个魔法数字可以避免很多折腾。最近看到一篇文章，作者提到用 CSS Variable 来赋予相对而非绝对数值的 `z-index` 值，真是优雅简洁的方法！完美的发挥了 CSS 变量的优势，促使我写下这篇文章。
賦予網頁元素相對的關係而非絕對的數值，讓我們強烈聯繫元素之間的差異，而非取決於某個魔法數字可以避免很多折騰。最近看到一篇文章，作者提到用 CSS Variable 來賦予相對而非絕對數值的 `z-index` 值，真是優雅簡潔的方法！完美的發揮了 CSS 變數的優勢，促使我寫下這篇文章。
索取並顯示資料對前端工程師來說是家常便飯的事，但隨著背後延伸的狀態越來越多，就會讓整個專案極度混亂，因此想要藉由這篇文章點出現有問題並提出一些可行的方案，紀錄尋找更高效解法的過程。在索取資料時連帶的有許多狀態需要被管理和調整，文章透過 Vue 來探討如何更優雅的處理這些狀態。
本文描述近期在維護既有代碼時的故事，目前的專案中有各式各樣前人尚未統一的驗證方式，例如：有些是使用 HTML 原生客戶端驗證、伺服器端驗證、第三方套件、自造的驗證方法，如何統一規範驗證方式是一大問題，同時也要思考：「要如何避免創造更多的陳舊代碼？」
本系列 Astro 文章終於完結了，必須說連續 30 天到了後段有點寫不太出來任何東西，秉持著有寫任何東西無論如何都比沒寫強的精神完成了這次的挑戰！本系列文章是當完兵出來沒多久馬上開始寫的，因此是在最後一天開賽而且還只有不到 10 篇的屯稿的狀態下進行的，加上日後工作也忙碌起來，能夠完賽算是很幸運。
終於到第 29 天了……前面寫太多沒有規劃好反而到後面也不知道要多寫什麼。其實在撰寫這 30 天文章之前我有先試寫紀錄一下我用 Astro 製作個人網站的過程，可以參考看看：製作個人前端作品集 - 準備篇以及實作篇，裡面有記錄從發想草稿到實作的過程，如果想要製作個小網站試試水溫可以參考看看。
感覺 30 天真的要寫不下去了 😅，感覺要寫的前面都寫過了，今天這一篇來介紹 Astro 有那些資源可以入門以及近期的新聞。就在昨天 Astro 發布了 3.3 版本，來了嶄新的實驗性圖片組件 <Picture />，改進了語法突出顯示的相容性，引入了套件的可信性證明，以及其他一些提升使用體驗的改進。
本章節來談談 Astro 3.0 版本最吸睛的一項功能：View Transitions ，讓你的靜態網頁也能達成 App 應用一樣的絲滑感受。由於這項技術還在實驗階段，因此放在後面的章節補充。View Transitions API 是瀏覽器正推出的一項 API，提供簡易的方法對任何 DOM 狀態更換提供轉場特效。