Dec 19, 2010 Reading time ~1 minute

很久之前無聊寫的Chrome Extension

Chrome Extension其實還蠻簡單的, 之前無聊試寫了一個, 其實也不是啥大東西, 就只是去氣象局抓張最新的衛星雲圖回來

沒啥code, 隨便把它開放出來好了: https://bitbucket.org/fishuman/taiwansatimage/src

Dec 8, 2010 Reading time ~2 minutes

[筆記] 產生 Web page thumbnail (續前篇)

在前篇提到利用CutyCapt來產生Web page thumbnail, 不過畢竟CutyCapt是C++寫的, build出來也是一個執行檔, 寫完上一篇就有股衝動想用PyQt來做, 反正一樣可以利用Qt/WebKit, 原理應該相同的

沒想到, 真的那麼簡單, 只用了二十幾行code就可以辦到了

這邊主要利用到的一個class就是 QWebPage , 透過這個class我們就可以很簡單的達成這任務

為了程式的重複利用性, 我把它包裝成一個class PageRender:

class PageRender(QObject):
   def __init__(self, url, outfile, scale):
   QObject.__init__(self)
   self.outfile = outfile
   self.scale = scale
   self.web = QWebPage()
   self.web.mainFrame().load(QUrl(url))
   self.connect(self.web, SIGNAL(“loadFinished(bool)”) ,self.loadFinished)
   def loadFinished(self, b):
   print “load finished”
   self.web.setViewportSize(self.web.mainFrame().contentsSize())
   image = QImage(self.web.viewportSize(), QImage.Format_ARGB32);
   painter = QPainter(image)
   self.web.mainFrame().render(painter)
   painter.end()
   thumbnail = image.scaledToWidth(self.scale)
   thumbnail.save(self.outfile)
   app.exit(0)

在Constructor那邊做的就是把loadFinished跟我們實際處理save to thumbnail的function connect在一起

而在loadFinished那邊就是實際render到image的部份, 這邊要注意的是:

self.web.setViewportSize(self.web.mainFrame().contentsSize())

這是把QWebPage的View port size設成跟實際content一樣大, 後面接著我們就可以建立QImage跟其相對映的painter, 然後用QWebFrame的"render()“把它實際輸出到image

最後scale到我們想要的大小(pixels)

這邊是一個實際call它的範例:

p = PageRender("http://www.yahoo.com.tw”, “sssss.png”, 200)

結果:

實際的程式可以在此下載

Dec 8, 2010 Reading time ~1 minute

[筆記] 產生 Web page thumbnail

剛突然想弄一個可以產生Web page thumbnail的service

第一個想到的是能不能用Webkit做一個, 不過, 自己寫, 有點太麻煩了, 想說應該有人做過, 後來就找到這個: CutyCapt

這軟體是用qt寫的, 也不會很複雜, 只有六百多行 (有點想用PyQt仿一個 :P), 也很容易就可以build起來了(只要qmake; make), 但記得要裝libqt4-dev就是了

使用方式很簡單:

CutyCapt -url=http://julianshen.posterous.com -out=julian.png

但產生的檔案, 是一整個頁很大一張, 像這樣(點開可以看大圖) :

這樣就不能算是thumbnail了吧?

所以只好拿ImageMagick來剪成200x200的Thumbnail

我用的command是這樣:

convert -resize 200 -shave 0x200 julian.png julian_small.png

出來的結果:

再找時間包裝成一個web app吧~~

Dec 6, 2010 Reading time ~2 minutes

A pattern learned from memcached

晚上快速翻了一變 memcached , 想了一些想法, 趁還沒忘之前先寫下來再去睡好了

memcahced的設計概念說實在的簡單到不行, 說簡單不是說他不好或是沒什麼, 反而這麼一個簡單的設計, 幫助真的會不小

memcached簡單說了就是一個分散式key-value based data cache, 資料是分散放在很多台電腦的RAM裡面, 因為是key-value based, 所以說起來就是一個大的hash table, 並不需要複雜的query, 只需要O(1)就可以取得資料, 而且資料就在RAM中, 可以是相當的快

我們都知道一個事實: “IO costs”, 如果每次都需要從database query資料, 那所花的時間, 包含SQL處理的時間, 以及IO的時間會是相當長的, 這點不管是Web application或是在mobile上(尤其現在SQLite被大量使用)都通用

因此使用RAM來cache query result as long as possible會是tuning這類的performance的其中一步, 這觀念應該是很多人都想的到

不過這樣得pattern可能得考慮的:

怎樣把一個常用且複雜的query對應到一個key-value pair
cache的存續時間
How to efficiently invalidate or update cache after data set changed

或許在Android的ContentProvider中可以引入memory caching的機制來減少IO的量

Dec 2, 2010 Reading time ~1 minute

[筆記] Embed Youtube player

以往嵌入Youtube video到網頁中要貼一大堆醜醜的object tag像是:

後來股溝大神….提供了一個新的方式, 這方式不用太過複雜的tag (說穿了不過就是用iframe包裝起來), 而且會隨使用者設定選擇到底是用Flash還是HTML5 player :

底下是實際的範例:

Le murmure de Julian

Web Dev

很久之前無聊寫的Chrome Extension

[筆記] 產生 Web page thumbnail (續前篇)

[筆記] 產生 Web page thumbnail

A pattern learned from memcached

[筆記] Embed Youtube player