Flex source code reading - 1

Stack trace示範教學

昨天找到了Flex原始碼分析的影片，今天就看了約30分鐘（我還要讀麻煩的麻醉共筆囧），今天看到的總結一下：

首先影片的開頭，慣例性的擺上Flex和為什麼要念source code的introduction。有趣的部份是主講的歪國人先生slide套了星際大戰：天行者路克原本是個.Net程式設計師，他有個夢想是有一天可以擁有屬於自己的component，但因為.Net的class library是close source + proprietary的（我知道現在不是XD），非常難以擴充修改，他的PM覺得跟別人買close source的component就好，於是，路克先生每天都要忙很多雜事：確認維護合約，跟對方的工程師溝通，Hack他買的Component，解決修改之間造成的衝突。有一天，他遇到了一個謎樣的男人，告訴他有Flex這個東西，只是當他要把好消息告訴他的PM之時，他發現帝國已經宰了他的team，於是，他只好到大師那邊去受訓，學習閱讀Flex source code之道。這部份看了讓人精神振奮，很有趣的Introduction啊，要是大堂課也那麼有趣就好XD

後來歪國人先生開始展示他的魔術了。如何理解Flex component：比如一個按鈕，他的Life cycle呢？Life cycle是一個我之前都沒注意到的概念，要先想一個component從出生到滅亡大概會拿來做什麼事情，才不會在密密麻麻的source code間見樹不見林，在你看source code之前你就要先理解他！回到歪國人的演講，怎麼瞭解一個按鈕他的程式碼怎麼跟其他元件互動？答案是：1.繼承他2.stack trace。寫個子物件繼承按鈕，然後寫個子物件方法覆蓋母物件的方法，但內容除了印一行除錯訊息外就直接呼叫母物件的方法。那行除錯訊息就印出stack trace：哪個物件那一行程式碼呼叫了他。之後按下執行，實際上去玩弄那個按鈕，就可以看到按鈕的某特定方法是怎麼和其他東西互動的。搭配source code的命名方式和一點點經驗和猜測，馬上就能弄懂按鈕的設計在搞些什麼鬼。看見方法實際上動起來跳舞給你看是很棒的經驗，比躺著不動的source code有趣多了。

除了繼承的技巧之外，剩下的印象就是IDE和DisplayObject。IDE是Flex Builder 3。一樣的一套IDE，在歪國人手上拿來開發的速度就是和我不一樣。歪國人用了一些靈巧的快捷鍵，就可以快速作到我原本要花很久時間的雜事：如找出某物件的母物件到底在哪個原始檔，快速瀏覽這個物件的介面等，我要花五分鐘的事情歪國人只要兩秒。IDE在正確的使用下可以提昇如此驚人的效率提昇，難怪大家要用方便的IDE了。除了可以節省時間，把時間用於珍貴的開發而不是雜事之外。還可以節省精力。優美、臭蟲少的程式以及媲美造化的設計源自於充滿精力的程式設計師。當程式設計師覺得很累時，如被醫院的VS電的亂七八糟，他什麼爛code都寫得出來。

總之，這位歪國人先生展示的是一種和我完全不同的層次，如果說我設計的是小磚塊，那他設計的就是房子了。設計房子牽涉到更多的學問：團隊合作、理解別人，快速的抓住複雜物體的架構...這些都是我目前欠缺的。

最後一句話紀錄DisplayObject。DisplayObject是opensource Flex framework和底層flash VM的交接口，以上。 全文連結