原创 芝麻與百合

只有當我踏進外省的那些旅館,我才感到幸福,那些房間裏有一股陳朽的芳香,風將它們吹散,卻無法根本抹去;在那裏,每當晚上我們打開房門,感覺就像擅自闖進了一個原本在那兒的、散亂的人生,當門又關上時,我們一邊用手勇敢地抓住這人生,一邊往更裏面走,一

原创 Shadertoy 教程 Part 5 - 運用SDF繪製出更多的2D圖形

Note: This series blog was translated from Nathan Vaughn's Shaders Language Tutorial and has been authorized by the aut

原创 Shadertoy 教程 Part 3 - 矩形和旋轉

Note: This series blog was translated from Nathan Vaughn's Shaders Language Tutorial and has been authorized by the aut

原创 Shadertoy 教程 Part 4 - 繪製多個2D圖形和混入

Note: This series blog was translated from Nathan Vaughn's Shaders Language Tutorial and has been authorized by the aut

原创 難兄弟·伯夷叔齊

求仁得仁,又有何怨?——孔子 魯迅先生在自己的故事新篇《采薇》裏面寫到一個故事,講的是兩位老人家因爲不願意接受時代的變化,而自己卻堅守着自己的道義,最終毀滅。舊瓶裝新酒,用古人的故事,表達自己的觀點。魯迅先生是在嘲笑自己那個新舊交替的

原创 圖形着色器公式

開篇 我在Shadertoy或者WegGL中編寫着色器程序時,經常需要用到許多繪製2D或者3D圖形學公式。和數學公式一樣,這些公式大多數時候是需要記憶的。爲了後續方便記憶和查閱,本博文總結了一些我在平時開發繪製圖形(尤其是3D圖形)時常用的

原创 如何編寫一個NPM工具包

編寫代碼只是我們整個軟件開發流程中很小的一部分,一個完整的軟件開發流程還包含其準備,測試,部署等其他階段。在這些階段,我們會用到除了編程語言之外的很多工具幫助我們搭起來一套工作流程。本這篇文章,通過一個實際項目,將這套流程輔助工具用到項

原创 HTTP 緩存終極指南

TL;DR 錯誤的緩存策略是如何抵消你所做的性能優化工作的。 緩存存在於客戶端並且通過chrome或者其他抓包工具查看其狀態信息。 客戶端通過header中的各個字段做緩存的過期判斷。 代理服務器上也存在緩存,並且使得我們在計算瀏覽器緩

原创 如何搭建自己的CLI工具

爲什麼要CLI CLI 英文全稱爲Command Line Interface,是在圖形界面普及之前人們與電腦的交互方式。例如我們經常在控制檯敲的命令系統,或者linux的操作系統命令,或者自己定義的一些列電腦操作命名,凡是通過這種命令去與

原创 如何計算TTI

TLDR TTI指的是用戶與UI界面的可交互時間點,它無法用瀏覽器的API直接偵測到。 TTI的關鍵指標與longtask,network-status,FMP以及quite window有關係。 利用請求代理以及瀏覽器MutationO

原创 Retina 技術

問題 有沒有遇到這樣的一個問題,爲什麼在某些設備上需要用到2倍圖。當你的設計師過來問你的時候,你可能回答她:因爲這些設備像素高,需要高清的圖片才能顯示清楚呢。事實上要搞清楚這個問題,我們需要知道的不僅僅是分辨率這麼簡單。爲了弄清楚爲什麼要用

原创 RAF是什麼東東

開篇 我們之前在這篇文章裏面講過瀏覽器的事件循環,還提到事件隊列,調用棧等瀏覽器的一些實現機制。但還有一些細節我們沒有提到,這篇文章我們就來把這些細節補充。 幀和動畫 你一定知道動畫片是怎樣製作的,沒錯,只需要很多張畫滿動畫的紙張,只要這些

原创 Shadertoy 教程 Part 2 - 圓和動畫

Note: This series blog was translated from Nathan Vaughn's Shaders Language Tutorial and has been authorized by the aut

原创 Shadertoy 教程 Part 1 - 介紹

Note: This series blog was translated from Nathan Vaughn's Shaders Language Tutorial and has been authorized by the aut

原创 IOS9.0中hash值的bug與解決方案

事件起因 事情是這樣的:產品上線發佈,突然出現了問題。運營Gg過來反應,當場給露珠演示,運營同事的手機是iphone,bug確實是存在的。奇怪的是露珠用了其他iphone手機(借別人的,露珠的是吊死安卓機),卻沒有發現這個問題。仔細詢問,同