Tag Archives: graph

Google Chrome 支援 APNG 了...

翻資料的時候才發現 Google Chrome 從 59 版 (今年六月進 stable channel) 就支援 APNG 了,這樣所有主流瀏覽器只剩下微軟家的 IE 與 Edge 還沒支援了: 找了一下當時的新聞:「Chrome 59 will fully support animated PNGs」,以及對應的 ticket:「Request for enhancement: APNG (animated PNG)」。 APNG 相較於 GIF 多了透明的設計 (GIF 需要拿一個顏色來當作透明),以及更多的色彩,但對於瀏覽器的支援一直都不完整: The GIF file format has … Continue reading

Posted in Browser, Computer, GoogleChrome, Murmuring, Network, Photo, Recreation, Software, WWW|Tagged , , , , , , , , , , |3 Comments

CPU 指令的速度

在「Infographics: Operation Costs in CPU Clock Cycles」這邊看到張有趣的圖片: 文章大致說明了底層指令速度差異的由來,另外也提到了 C/C++ Function Calls、Indirect and Virtual Calls、Allocations、Kernel Calls、C++ Exceptions 以及 Thread Context Switches 這些高階面向的 CPU clock cycle 差異... 不過重點還是在這張圖 XD

Posted in Computer, Hardware, Murmuring, Programming|Tagged , , , , , , , , |Leave a comment

Dropbox 針對 JPEG 圖片再次「無損壓縮」的 Lepton

Dropbox 針對 JPEG 圖片再次無損壓縮所發展出來的 Lepton:「Lepton image compression: saving 22% losslessly from images at 15MB/s」。 直接用傳統壓縮方式對 JPEG 檔壓縮是沒有用的,他們針對 JPEG 裡的內容分析後再次無損壓縮,並且可以還原成原來的 JPEG: Lepton achieves a 22% savings reduction for existing JPEG images, by predicting coefficients in JPEG blocks and feeding those predictions … Continue reading

Posted in Computer, Murmuring, Network, Programming, Software|Tagged , , , , , |Leave a comment

Flame Graph

常看到這種圖,但卻不知道這種圖是用什麼做出來的,或是他的名字: 剛剛在「Igniting Node.js Flames」這邊看到這叫做 Flame Graph,出自「brendangregg/FlameGraph」這邊。 在 Linux 上可以用 perf 產生資料檔案,在 FreeBSD 或是 Solaris 上可以用 DTrace 產生... 是個來理解效能瓶頸的好工具 :o

Posted in Computer, Murmuring, Programming, Software|Tagged , , , , , , , |1 Comment

用 CSS 比較兩張圖片的差異...

老文章但上了 Hacker News:「Image diffing using CSS」。 於是本來這樣的兩張圖: 在經過 -webkit-filter: invert(100%) opacity(50%); 的疊合下變成:(這邊就直接抓圖了)

Posted in Computer, CSS, Murmuring, Network, WWW|Tagged , , , , , , |Leave a comment

Firefox 41 可以抓單個 DOM 元素的擷圖了

在「Trainspotting: Firefox 41」這邊的介紹可以看到範例: 抓下來變成這樣: 這功能真不錯...

Posted in Browser, Computer, Firefox, Murmuring, Network, Software, WWW|Tagged , , , , , , |1 Comment

用 mermaid 畫流程圖...

mermaid 這個專案畫出來的圖還蠻順眼,雖然與 DOT graph 的語法不太一樣,不過還是很簡單,看一下介紹就會用了。 在 cdnjs 上有 hosting,把 code 放到 div 裡面,設定 class="mermaid",然後直接 script 掛進來就可以了。不過最近 CloudFlare 的速度一直很不順,在意的人可以考慮自己 hosting 一份。 簡單的像是這樣: 比較複雜點的:

Posted in Computer, Murmuring, Network, Programming, Software, WWW|Tagged , , , , , , , , |Leave a comment

圖表表達的能力...

看到「Data looks better naked」這篇,把這樣的圖表: 變成這樣的圖表: 作者有做動態 GIF,可以直接看怎麼變化: 也可以看 Speaker Deck 上的投影片,一步一步停下來了解:

Posted in Computer, Murmuring, Science|Tagged , , , , |Leave a comment

1999 年與 2008 年 Conference T-shirt size 的差別...

Twitter 上看到 b123400 的 retweet,專程貼出來有種好無奈的感覺... XD probably the saddest graph ever shown in a CS conference. #Linux #tshirtsize pic.twitter.com/RWBnTSJ2ip — AlexandrosKapravelos (@kapravel) September 5, 2013

Posted in Computer, Linux, Murmuring, OS, Software|Tagged , , , , , , |1 Comment

使用 PNG 對圖片失真壓縮...

PNG 是無失真影像壓縮格式,但我們仍然可以修改 pixel (失真) 讓 PNG 壓縮率更好。今天在「PNG can be a lossy format」看到的 Mac OS X 應用程式就是這個用途。 雖然是應用程式,但作者還是有說明 algorithm 是哪些,分別是從哪裡來。其中兩個是: Shrink PNG files by applying a lossy filter pngquant 文章最後,作者對 GIF 很感冒... XD GIF has antiquated compression and it's a complete … Continue reading

Posted in Computer, Murmuring, Network, Programming, Software, WWW|Tagged , , , , , , , , , , |1 Comment