2012年2月28日

Mozilla Links 正體中文版徵求熱血譯者

Mozilla Links 正體中文版的讀者大家好:

MozLinks 正體中文版是 Mozilla 台灣社群合力經營的中文部落格,除了 MozTW 相關活動報導中文特稿以外,Mozilla Links 英文版主站Mozilla 官方各 Blog 文章翻譯,也是我們的主要任務。

自 2006 年開站至今六年來,感謝數不清的 MozLinks 翻譯機動隊成員共同協力,我們已經發出 405 篇文章(以及 05 年前的十期月刊)。我們的讀者來自世界各地,近三個月平均每月不重複讀者超過五千人,開站至今即將邁向 40 萬瀏覽次數(PV)!

隨著網路面貌改變,Mozilla 也隨之進化,Firefox 開發進度加速、Mozilla B2GPersona 等各專案也蓬勃發展,現在我們有更多更多的消息,可以引介給正體中文的使用者。

但是由於許多譯者從學校畢業、投入職場、步入人生的新階段,因此我們要來大舉招募翻譯新血嘍!

加入 MozLinks 中文版翻譯機動隊的方式很簡單,現在又更簡單了:

  1. 打開 Google Doc 待譯資料夾,選一篇有興趣的文章,開始動手翻譯。
  2. 翻譯完成後,請發一封 email 到機動隊群組,告訴大家你已經完成某篇文章。
  3. 經過校稿及編輯,就會發到 Mozilla Links 上嘍。

歡迎各位朋友加入 Mozilla 相關資訊的翻譯行列,讓我們一起用文字與熱血實踐 Mozilla 宣言,傳達理念、保護網路、改變世界!

2012年2月25日

摩茲動手做(一)如何幫 Firefox 抓蟲

摩茲動手做系列是 Mozilla Links 中文版的特別企劃,本專題中將會有一系列如何貢獻 Mozilla 與開放網路的心得分享,歡迎大家在閱讀後按部就班,與我們一起動手實作,加入貢獻開放網路的行列!

第一集的分享者為 W3C HTML5 中文興趣小組的 Kenny,他將與我們分享如何動手撰寫 Patch,實際投入修補 Firefox 程式的經驗。


八月底的時候柏強轉了我在 W3C 中文興趣小組發的《貢獻 HTML 規範的步驟(非常簡單,內含真實案例)》(編按:下集上映)。上個禮拜三(11' 10/19)清晨的時候,我繳交了我對 Gecko(Firefox 渲染引擎)的第一個補丁(後來想想看其實是人生的第一個補丁),然後再隔天得到了 r+, r=bz,所以仿照那篇我自己的文章,來寫一個 Gecko 的版本。首先講解一下:

r+ 是指通過 review(怎麼翻?審核?)的補丁,之後 land 之後就會成為 Mozilla 整個大程式碼庫的一部分。r? 就是要求審核,r- 是審核不通過。r=bz 是指審核的人是 bz,基本上是在 IRC 上的代號。

步驟(參考 MDN - How to Submit a Patch

  1. 找一個想解決的問題,上次我回 Toby 信的那篇給了幾個第一次貢獻 Mozilla 的推薦 bug 的連結。(編按:這些 [Good First Bug] 的 Bug 是 Mozilla 的工程師標示的,代表問題適合新手實作)
  2. (可選)如果這個問題不是從 Bugzilla 上找來的,去回報這個 bug。
  3. 努力看程式碼/寫程式碼直到在自己電腦上可以跑了。
  4. 廣泛測試
  5. 在該 bug 上提交補丁
  6. 找審核的人
  7. 根據審核的人講的話改補丁
  8. 請有程式碼庫權限的人 commit

真實案例

  1. 在翻譯 + 註解 CSS2.1 怎麼處理 'display: table-*' 的章節的時候,發現到程式碼裡面有一個邏輯明顯不合規範。有機會我再在中文興趣小組的郵件群講好了,老實說這個問題恐怕正常人一生都不會碰到,不過反正不合規範也不跟 IE 兼容所以修掉也無訪。

    (翻譯 + 註解計畫是中文興趣小組 HTML5 規範翻譯計畫的一個延伸,基本上就是把規範裡的一些部份直接用超連結連到代碼,這是希望未來對瀏覽器開發(Gecko 或 WebKit)有興趣的人可以直接看規範找到對應的的程式碼,快速進入可以開發的階段,算是一個一起累積看代碼經驗的計畫。雖然說這是一個延伸,不過我本來一開始目標就是這個。目前做 HTML5 規範翻譯的人只有我在做這件事,不過我有想要積極吸取對做註解也有興趣的人。)

  2. 因為是自己看代碼找出來的錯誤,所以就自己去報 bug,代號是 695538。我覺得一般來說這比較不太正常一點……我想從已有的問題下去解應該比較像是解決問題,畢竟規範也很可能是錯的。(真的真的有興趣的人可以去玩我報的那個 bug 裡面的測試資料在不同瀏覽器的不同,可能會被嚇到喔 xdd)

  3. 在做規範註解的時候的確花了很多時間看代碼,寫代碼反而花的時間非常少,才十行左右而已(加五行的註解)。其實到目前為止我的 C++ 經驗不到 3000 行,所以一般來說我不覺得程式語言是特別大的問題(也可能是我還沒做大修改的關係),看大型專案代碼的技巧倒是很重要,用 gdb 很有幫助。希望以後 Mozilla 有技術交流的郵件群的時候可以多交流一下。

    我在自己的電腦上改了之後,編譯一次過關、開啟 Firefox 看到自己做得測試資料過關的時候實在是 high 翻天了,但是再走兩步之後就當機了 xdd。後來改了一下當機的地方,基本上還是那十行。

  4. 早有耳聞 Gecko 有一種叫做 reftest 的測試 CSS 的方法,他的原理是比較兩個不同的 HTML,若渲染的結果的像素是一樣的就過關,以測試 CSS 的不同功能。知道是知道,跑起來還是蠻好玩的,他會開啟一個很奇怪的 Firefox 然後裡面就有一個視窗不斷讀取各個測試資料,所以會一直閃。我在裡面看到了幾次看起來像是中文的測資,以後有機會應該仔細看看那些裡面有沒有奇怪的內容 xddd

  5. 用 bugzilla 繳交補丁,我一開始是用 hg diff 的結果,後來被指導了一下,請看下面。

  6. 因為 CSS 工作組的郵件群中,bz 在 2009 年的時候一直計較這個十分無聊的章節。所以我知道這部份的審核找他就對了,而且我還蠻崇拜他的,恰恰好 xdd
  7. bz 把我的代碼從 10 行壓縮到 2 行,我一開始也有這樣想,但是覺得那樣好像慢了一點,寧可增加代碼的大小也不想拖累速度,不過他覺得 2 行的邏輯比較清楚,我基本上對 C++ 也不是很熟,反正我沒什麼意見就聽了他的話了。

    後來註解的英文錯有被挑掉,總之這裡重複了更改→上傳→審核了一次他就說:「這裡我有兩個註解上的建議,不過你用原來的也可以,改了之後就 r+。要不要寫 reftest?」基本上要求我聽他一個,另一個不聽,不過反正他也說都可以,按照 MDN 的說法我改好註解之後我就自己給自己 r+ 了(這裡好像有點小問題,不過不太重要)。

    然後他注意到我的補丁後面有一個 (First Patch) 的字樣,就跟我講說如果還不會 mq 就去學一下,我一開始還以為 mq 就是 hg,後來才知道 mq 是 Mercurial Queues,總之 MDN 寫的蠻好的,學起來沒什麼問題。補丁後來就是用 mq 做的。

    後來從我寫的測試資料裡抽了一個出來做 reftest。

  8. 我在 Keyword 加了個 checkin-needed,後來隔天專門 land 補丁的人就 land 了。

    (這個過程有點小插曲,因為 bz 已經說給我 r+ 了又問我要不要寫 reftest,我就以為我寫 reftest 不需要再審核了。事實上是需要的, 而且這個 reftest 我真的寫錯了 class="table" 寫成 cless="table" xddd 真丟臉)

心得

整個補丁提交的過程只花了兩天以內,基本上還蠻愉快的,而且 bz 這種高人還有注意到我是(First Patch)並給了親切指點,有點開心。

幾個朋友應該知道我對瀏覽器標準的實作上很有怨念,雖然有參與過幾個 bug 的討論,也幫忙寫過測試資料,但是實際上只是我的第一個補丁而已。平常還是嘴砲太多了,罪孽罪孽,之後翻譯 + 註解規範的過程中發現了手癢想改的狀況會繼續努力的。

話說只有兩行的貢獻能不能拿 T-shirt 啊?不過不管怎麼樣如果大家到 Firefox 10 還繼續用 Firefox 的話就會執行到我的程式碼啦,有點爽 xdd 希望以後 Mozilla 也能指點社群成員走過這些步驟啦,有點像是我在 HTML5 中文興趣小組指點一下別人走過標準制定的過程那樣。期待 Mozilla 早一點有用中文討論技術的郵件群。(編按:Mozilla 中文開發者郵件群成立嘍!詳見文末)

HTML5 規範翻譯仍然繼續歡迎各位參加,歡迎私下聯絡或是加入 QQ 群 151145242(歡迎圍觀)。我們……還算歡樂吧,我有時後會不小心講太多真心話 xddd。

如果對瀏覽器實作有興趣的話也歡迎加入 IRC irc.mozilla.org#mozilla-taiwan 吧,不過人比較少,而且我應該還沒有到可以指導別人的程度,不過我想 thinker 應該可以,大家快去打擾他要求他指點指點吧!

Kenny


MDN 相關參考文件:Hacking FirefoxContributing to the Mozilla codebase

由於 Kenny 熱情提議與先前討論Mozilla 中文開發者郵件群組現在成立嘍!歡迎對 Firefox、Thunderbird 套件與 Gecko 核心開發、Mozilla 各程式專案有興趣的朋友加入,讓我們一起鑽研相關技術。

加入群組請至 lists.mozilla.org/listinfo/dev-general-zh 訂閱,記得發篇自介跟大家打聲招呼喔!(目前 Mailing List 在 Google Groups 上的封存頁面有點問題,大家可以直接透過 News 閱讀群組內過去的文章)

φ 原文 / Kenny 撰寫;Irvin 編輯

2012年2月6日

Firefox 7 到 Firefox 10 更新了什麼?

這是 Chris Blizzard 在 reddit 上的 留言

在 Firefox 7 與 Firefox 10 之間(譯注:六個月內),我們增進效能、除去洩漏減少記憶體用量、大幅強化 Canvas 元素的硬體加速、改善 Firefox 同步的設定性與可靠度、大幅改變附加元件相容性的處理方法、加入啟動時依需求載入分頁的功能、改善 HTML 影音元素可靠度、改善與 OS X Lion 的系統佈景一致性、在沒用時隱藏下一頁按鈕、修了一大堆安全與穩定性的 Bug。Firefox 10 不論是看起來、用起來、動起來都與 Firefox 7 不同了啦。

在開發者面,我們增加 text-overflow-ellipsis、WebSockets、web timing、強化 MathML、加入 WebGL 下透過 CORS 的顯示圖片支援、HTML5 右鍵選單、加入 insertAdjacentHTML 支援、在 CSS 中加入連字符以支援英語以外的語系、推出新的類別推定 TI JS 引擎(快上加快!)、加入 JS 讀取 DNT 狀態的支援、加入 font-stretch 支援、加入 WebGL、CSS 3D 轉換與 Mozilla HTML5 全螢幕 API 的反鋸齒功能、讓 IndexedDB 更快、推出數個網路開發者工具、以及一大大大大大大堆沒有列在這邊的東西。

所以牛仔很忙,我們很高興能在第一時間將好東西推出給使用者,所以才有了新的 Firefox 釋出週期。Firefox 的版號快速增加不只是行銷而已,而是反映了 Firefox 的適時進化。

消息來源 / What happened between Firefox 7 and Firefox 10 // by Paul Rouget

φ 在 Firefox 4 之前的美好時代,這些進步之處還得再等上大半年、外加無數個 Beta 與延遲,才能正式推到使用者手上呢。 Irvin 翻譯

2012年2月4日

Firefox 10 新增了令人興奮的開發者工具

Winodws、Mac 及 Linux 版 Firefox 10 新增了強大的內建開發者工具,並且將擴充套件改為預設相容,讓往後的更新更為順暢。

Firefoxs 10 新增了幾項能讓開發者即時改變網站外觀的工具:使用檢測元件 (Page Inspector) 開發者不用離開 Firefox 就可以迅速的瀏覽頁面元素,並且檢視整個頁面的 HTML 文件結構及排版。樣式編輯器 (Style Inspector) 讓編輯網站樣式更輕鬆了,設計師可以直接存取網頁的 CSS 屬性,並直接在 Firefox 中檢視或修改其值;程式碼片段速記本 (Scretchpad) 透過 Eclipse Orion 程式碼編輯器,提供顏色標示及其他功能,讓撰寫 JavaScript 更輕鬆簡單。

Firefox with highlighter and HTML code screenshot

此版 Firefox 新增了 Mozilla Full-Screen API 給網站或網頁應用程式,讓開發者借助全螢幕的優勢來創造更佳的網站體驗,例如全螢幕遊戲、身歷其境的影片體驗和更豐富的簡報分享。我們對於能夠提供媲美遊戲主機的遊戲體驗感到非常興奮,也很高興其他瀏覽器也正陸續導入這項功能!

Firefox 支援了幾項可以更輕易透過開放技術打造 3D 網路體驗的功能,像是 Mozilla 首創的 WebGL。WebGL 是一項網路標準,讓網站及網頁應用程式能顯示硬體加速的 3D 影像,現在我們在 WebGL 上支援了反鋸齒功能,讓物件可以更順暢的融合及移動。Firefox 另外也支援 CSS 3D Transforms,透過 HTML5 讓開發者可以讓二維物件進行 3D 動畫轉換,不再需要第三方的外掛程式。

我們也大幅地增進 Firefox 套件相容性,並簡化了程式的更新流程,因為我們不斷致力於提供最佳的 Firefox 體驗!

更多訊息請見:

原文 / Firefox Adds Powerful New Developer Tools | The Mozilla Blog
授權 / 創用 CC 姓名標示─相同方式分享 3.0

φ 蘿蔔王 翻譯 - Irvin 編輯