謀智台客

當初我們決定要將 Firefox OS 應用到智慧電視 (Smart TV) 上時，第一個遇到的問題便是操作介面的不同。在一般的電視使用情境下，使用者通常不會有滑鼠或是觸碰螢幕，能拿來操作的是那少少幾個按鍵的電視遙控器 (好吧，其實現在電視遙控器上的按鍵還不少)。在將 Firefox OS 這樣一個...

近年來在資訊業最火熱的話題無疑就是虛擬實境 (Virtual Reality，VR) 了。除了 Oculus 推出 Oculus Rift 之外，其他如 HTC、Google、Samsung 等科技大廠亦各別推出自己的解決方案。VR 目前在遊戲、 電影、多媒體內容都有其龐大的市場需求。Mozilla...

感測器元件是連接實體世界和數位世界的橋樑，將物理現象轉化為電子訊號帶入軟體的次元。感測器元件的存在更是人機互動體驗的必要條件，如利用加速規（accelerometer）、陀螺儀（gyroscope）等動作感測器把手機當方向盤的 REAL RACING賽車遊戲、 利用近距感測器（proximity s...

在 Gecko 的實作裡，我們大量使用 smart pointer 作為指標傳遞間的媒介，而為了能完善的操作 reference count ，我們必須保證 reference count 的增減是 thread safe 的。若無法妥善處理 reference count 的增減而產生 race ...

有在關注謀智台客的朋友們，應該都知道 Firefox OS (B2G) 是由 Gaia、Gecko、Gonk 所組成。透過『我也想成為 mozillian！教你如何貢獻到 mozilla code base』我們對如何貢獻到 Gecko 的部分有了一定程度的了解，正因為 B2G 的 Gecko 是放...

invert 在各大平台上的 App 商店裡，影像處理相關的應用程式總是在熱門排行榜上佔有一席之地，Web Platform 當然也不落人後的提供建構影像處理 APP 的相關功能。在這篇文章裡，我們將介紹如何利用 HTML5 的 getUserMedia() API 來建構一個影像處理應用程式的架構...

Web這幾年最夯的主題之一就是Web Components [1][3]。透過它，我們能使用其他人開發好的Widgests來提高開發效率，不過風險是目前有些瀏覽器支援並不完全或必須手動開啟支援[6]，而我相信不久後所有瀏覽器就會完全支援囉[2]！ 今天，小弟想跟各位簡介如何使用Firefox OS的...

Treeherder 是一個彙集所有測試結果的地方，它將 CI (Continuous Integration) 的測試結果彙整起來變成一個精美的報表，好讓開發者可以直接透過網頁來查看各種測試項目的最新狀態或是錯誤訊息，甚至是幫你分析發生錯誤的測試項目是否是目前某些不穩定 Bug ( Intermi...

3369621175e75eedb4e0o Photo credit: Who? Me? | Flickr – Photo Sharing! 在研讀 Gecko 的程式碼時，常常會看到 doQueryInterface 與 doGetInterface 的用法出現，另外還有一個比較少見的 doQue...

在 XPCOM 的世界裡，透過 XPConnect 的幫忙，C 和 JavaScript 實作的元件可以互相地呼叫，因此我們可以自由選用合適的語言來開發各自的元件。 但是因為中間包了一層 wrapper，所以在某些特殊的情況下，程式的運作可能會不如你的預期：例如在 跨越語言的邊界 – 淺談 JS A...

Firefox OS 上的瀏覽器 APP 利用 Gecko 提供的 Browser API 來管理網頁瀏覽，並利用 HTML5 技術提供使用者界面。根據不同的實作它可以實現分頁，瀏覽歷史，書籤… 等等功能。這篇文章示範如何建立一個可以在 Firefox OS 裝置上使用的瀏覽器 APP，它包含了最基...

手機產品是 Firefox OS 的重要任務之一，Phone app 與 Callscreen app 實現了撥打/接聽電話功能，背後與底層溝通的媒介 Telephony API [1] 佔了非常重要的地位，安全性的考量下，Telephony API 僅開放給 Certified app 使用，不過...

前言 關於 XPCOM，請參考 MDN 上 XPCOM 的簡介。MDN 上關於 XPCOM 的教學，有部分實作上的細節已經過時了。此外，MDN 上的教學偏向使用 XPCOM 編寫 gecko 的擴充元件，身為 Mozilla 菜逼八軟體工程師要學的當然是給 gecko 內部使用的 XPCOM！因此在...

app screenshot 之前在 Eric [[1]](https://tech.mozilla.com.tw/ref1) 與 Owen 的文章 [[2]](https://tech.mozilla.com.tw/ref2) 已經介紹了如何使用 Geolocation API [[3]](htt...

在看過 Part I 部分，相信大部分人都可以了解如何完成一個 Firefox OS 地圖應用程式。在了解了地圖的基本應用之後，我也想要做一個簡單的程式。我想要完成一個可以在地圖上呈現更多資訊的地圖應用程式。除了顯示個人地理位置資訊，可以把我們感興趣的地圖資訊也呈現出來。 我們生活中常用的就是交通的...

05.EMULATOR 地理位置（Geolocation）的應用相信大家每天會使用到，早上查看上班前的交通狀況，傍晚打開手機 app 查詢附近的餐廳，上菜後照相打卡，看看週末旅行的城市天氣如何，或是用運動 app 記錄自己慢跑的速度，路線。在這篇短文，筆者將介紹如何在 Firefox OS 上，使用...

Debugging 絕對是每個 programmer 不得不面對的痛。有句俗話說 To err is human; to debug, divine. 當我們遇到一個 B2G 上的 bug，卻不清楚原因的時候，該怎麼辦呢？本文將介紹一些筆者日常工作中，對 B2G 的 Gecko C 部份常用的除錯方...

photocredit by mike demersphoto credit by mike demers 網頁應用（Web App） 網頁或網站設計是門很容易上手，但卻很難精通的領域。特別是近年來網頁相關技術隨著 HTML5、Node.js、Cordova 等的發展，網頁可適用的邊界進入了爆炸性擴...

Firefox 最受歡迎的特色之一就是量多而且質精的附加元件 (Addon)，在 Firefox Addons 網站 [[1]](https://tech.mozilla.com.tw/ref1) 您可以找到各式各樣的附加元件滿足您的各種上網需求。在這篇文章中我們將會介紹如何利用 Firefox A...

相信各位使用手機或多或少都有收過 SMS 簡訊或是定時鬧鈴等種種來自系統本身的通知，而在 Firefox OS 中，這些功能都可透過所謂的 system message 機制來達成，即便是在相關 app 尚未開啟的情況下。 簡而言之，system message 是為了處理一些必須要由 Gecko ...

在看 gecko 的 code 時無意間發現了這個神奇的區域變數： kungFuDeathGrip ，乍看之下這個奇怪的區域變數在 function 內就只有被宣告，並且沒有被使用到，那麼到底為什麼要有這個變數的存在呢？為了更進一步了解這個變數的由來，我們先來看看 kungFuDeathGrip 字...

Mercurial(hg) 是一款 mozilla 內部使用的版本控制系統，而 Mercurial Queue(MQ) 則是一個使用 Mercurial 時常用的套件，讓 upstream 和 downstream 的管理相處的和樂融融。雖然已經有非常多文件可供參閱[1][2][3][4]，但是一個...

相信大家多多少少玩過 iOS 手機上的 Siri 或是 Android 手機上的 Google Now！ 等語音辨識功能。 也或許有經驗因為長時間低頭滑手機太累而利用系統中的朗讀功能來"聽"文章。 而這兩種功能 1. Automated Speech Recognition. （ASR） 2. Te...

當 HTML5 發展日漸成熟之際，在多媒體的輸出原生支援方面，目前已經支援了大多數網路常見的格式，所以開發者可以使用 audio 或是 video tag 來進行影音播放控制。但輸入方面，目前各家瀏覽器並無統一的 API 實作，為解決此問題，W3C 委員會在 2013 年開始制定了MediaReco...

字型是使用者介面的基礎，所有顯示在畫面上的資訊都是由圖跟文字構成的。舉凡使用者需要閱讀、了解文意、或是進一步進行操作動作選擇的地方，不論是一段說明文字、一個對話框、圖示下面的標題文字、或是確認、取消的按鈕、系統設定畫面…等等，皆需要文字來構成。其實在介面設計中，沒有刻意去注意的話，可能不會發現，原來...

10yearssvg不知道大家有沒有注意到，這次的 Firefox 十週年活動網站上出現了一些特殊的動畫元素。這些元素不是 GIF 圖素，也不需要複雜的動畫套件，而是運用了 SVG 本身具備的動畫功能。 使用 SVG 來做動畫有幾個好處： 首先因為是向量圖形，所以任意縮放變形都不怕出現鋸齒顆粒。 多...

我們在 Firefox OS 手機的設定選單中，可以選擇開啟藍牙或是 GPS 這種手機硬體相關的功能。只要輕鬆點擊網頁語法寫出的按鈕，就可以操作裝置硬體，這在 web app 中是怎麼做到的呢？ Web app 開發者通常可以查詢相關的 web API 網頁，看是否有適合的 API 可以幫忙執行想要...

在 Mozilla 開發 Firefox OS 的歷程中，使用者體驗是我們非常著重的項目。在近期開發的 Firefox OS 版本（2.0）上，我們大幅修改了鎖定畫面（Lock Screen，或稱螢幕鎖）的外觀。下圖左是舊版畫面，圖右是新版畫面。 OldNotification NewLockscr...

(Ref: http://blog.openhatch.org/tag/newsletter/) Larry Wall（Perl 之父）曾說過，程式設計師有三大美德： 「懶惰」、「不耐煩」、以及「傲慢」。所以如果你想要成為偉大的程式設計師，你一定要懂得「偷懶」！在每天的軟體開發中，版本控制系統（Ve...

在開發的過程中，很常會遇到新上的 patch 不小心弄壞了已經存在的功能。處理這種 regression bug，尤其是在已經有大量 patch 加入了程式碼之後，要找出當初弄壞這個功能的 patch 更是難上加難。現在已經有一些工具能夠幫助你用 bisect 以二分法來找出造成問題的 patch，...

謀智台客之前的文章提到了有關 Gaiauitest ，在 Mozilla 工作團隊的努力下，這套工具已經越來越健全，足以寫出貼近使用者體驗的測試了。 對於開發者來說，更重要的是如何使用它來幫助自己開發的程式。下面以 Contact App 的例子，如何透過 Gaiauitest 的架構來測試 App...

RWD 全稱為 Responsive Web Design（適應性網頁設計），簡單來說就是讓你的網頁能夠伸縮自如的設計方式。在前兩篇文章介紹完九個 RWD 小撇步之後，接下來小小分析一些常見的 RWD 流言，並不是說這些流言都是胡謅一通，但我們如果常因為流言中的一些負面模糊形容而卻步，很可能就錯失了...

接續上一篇所介紹的一些基本 CSS 排版小技巧，本文第一部分開始介紹 CSS media queries 常見的使用方式，以及一些在開發初期就要先注意的地方；第二部分則介紹一些適應性設計相關的工具及 Javascript 套件。希望這些小撇步可以幫助你在開發網站上事半功倍囉！ 運用 CSS medi...

繼之前蓋索林大師的一個打十個系列文章，介紹了 Gaia WebApp 支援多種設備的技巧，本系列文章將深入介紹一些網頁適應性設計相關的通用工具及方法。如果你還不知道什麼是適應性設計，底下有簡潔的介紹。 什麼是適應性設計？它適合我嗎？ 適應性設計 (Responsive Web Design，簡稱 R...

隨著超低價的市場崛起，我們對各項資源也開始斤斤計較。不論是 CPU、RAM、及 Flash，每一個項目都是我們努力減少的目標。先前丹尼兄及艾倫兄已分別為大家介紹過 gecko 在處理記憶體管理上的文章[1][2]。這些都是著墨在記憶體管理上，今天醬糊小弟將向各位介紹一個在 gaia 存在已久的可視範...

Firefox 愛在鵲橋狐你幸福 在八月份的七夕搭鵲橋活動裡，用網頁動畫呈現了牛郎織女團聚慶祝的畫面。不知道有沒有眼尖的網友發現，其實活動網頁裡的動畫效果都是運用 CSS animation 及 CSS transition 所做出的特效喔！揪～竟～要怎麼做出這些特效呢？讓我們繼續看下去。 這邊也順...

“聽 海哭的聲音 這片海未免也太多情 悲泣到天明" 是低，大家都知道是阿妹經典到不行的歌，但是如果阿妹聲音播不出來，那哭的人就換成是我而不是那片海了 Orz ！ 請大家先從阿妹的歌聲裡 (或是我的哭聲?) 回到現實來，聽我來聊聊 Firefox OS 裡聲音的部分。基本上聲音系統裡可以簡單分成兩種，...

經常收看謀智台客的讀者可能已經看過怎麼開發一個 (Firefox) WebApp，或是可在 MDN 上找到相關開發資訊。 簡而言之，Mozilla 提出的開放 WebApp 標準草案，允許把使用網頁技術製作的網頁做成 App 來使用。提供的方式除了 App 使用者所習慣的 App Store 模式（...

在 Firefox OS 中，有一個類似 Android Zygote 的 process，利用 fork() 複製出應用程序並在這些應用程序間透過 copyonwrite 共享記憶體分頁。這麼做有助於降低記憶體用量和更快速的啟動應用程式。她的名字叫 Nuwa – 女媧 [[1]](https://...

先前 Alan 跟大家介紹過“凡走過必留下痕跡 – 如何獲得 memory allocation 的 footprint”，教大家如何生成 memory footpoint 來找出 memory leak 和減少記憶體使用量。今天，我要介紹的是 Firefox OS 如何在有限的記憶體下管理記憶體資...

前陣子收到一隻手機，需要把 Firefox OS porting 上去。剛好之前有看過這幾篇文章 B2G Porting, 三步驟 build 好 Firefox OS及透過 AOSP build system 來 build Firefox OS，不然還真不知道從那裡開始。先費了一翻功夫把 man...

什麼是 Cycle Collection ？ Gecko 專案中，常常會使用 smart pointer 來管理動態配置的記憶體的釋放。當記憶體的 reference count 為零時，就判定為不會再被使用。然而如果物件互相持有，形成了 reference cycle，也就是謀智台客這篇「說說 n...

LLVM 有一系列以 Sanitizer 結尾的偵錯工具(ASAN/TSAN/MSAN/DFSAN/LSAN)[[1]](https://clang.llvm.org/docs/)，每個工具各司其職，在此我們介紹其中的 ASAN[[2]](https://code.google.com/p/addr...

在 Mozilla 眾多的團隊中，有一個神秘的 UX Team ，很多人都很好奇到底這些人在做什麼? 整天都在會議室嘻嘻哈哈的討論工作，感覺很快樂。今天就來為大家解密，介紹一下 Mozilla 的 UX Team 。 首先，先跟大家解釋一下什麼是 UX ： UX（User Experience）就字...

先前 EragonJ 跟大家介紹過 Inter App Communication 的使用情境以及使用範例程式碼，本篇將繼續討論 InterApp Communcation（文章後面將縮寫為 IAC ）其他較少為人知的面向。 雙向通訊連線 使用 IAC 建立連線的程式碼通常如下： navigator...

Messaging Screenshot在人手一支智慧型手機的時代加上 3G ／4G 行動通訊快速的發展，已出現越來越多樣性的即時通訊軟體，例如：Line、WhatsApp 等等。但提到手機內建最老字號的通訊服務，當然是從 2G／2.5 G 時代就已經存在至今的 SMS（簡訊服務）與 MMS（多媒體...

mozillian這篇文章針對 part 1 的 Step 5 中的 Try Server 作進一步的說明。 測試是軟體開發中一個重要的步驟，用來確保軟體正確性、完整性、安全性和品質的過程。測試又分手動測試跟自動測試。在 Mozilla Gecko 這樣的大型軟體專案中，自動測試尤其重要。因為在大型...

大家都知道 Firefox OS 最大的賣點就在於其開放的平台以及以網頁為基礎的應用程式。相信常關注我們謀智台客的讀者們，也都知道在應用層下的核心引擎 Gecko 是用 C++ 撰寫而成的。Gecko 自開發以來經歷的好幾個年頭，C++ 也不斷地進步當中。 C++0x 在 C++0x 被提出的若干年...

自 ECMAScript 5.1 開始 JavaScript 加入了兩個關於陣列的函式：Array.prototype.map/reduce。這兩個函式可以針對陣列，讓開發者更清楚的描述接下來程式碼所要表達的運算性質。除此之外，也簡化了每次手寫迴圈進行尋訪陣列的繁瑣過程，特別是當尋訪實際上是要將原本...

前面介紹過了去年九月份活動頁的 Canvas 刮刮樂、以及照片上傳元件。 這次重頭戲來啦！ 登登登！傳說中的～視差動畫！ 設定你的視差捲軸動畫 視差效果視差效果（圖片取自 Wikipedia） 先構思好動畫的進行方式，視差故名思義就是景物因遠近不同造成視線內移動速度的差異， 最常見的例子是在坐車時，...

接續前一篇介紹 Canvas 刮刮樂的文章， 本篇介紹的是去年九月份 Firefox OS 讓你盡情享受每一刻 活動的照片上傳作法。 有做過上傳表單的人一定對瀏覽器提供的預設上傳元件有一些意見， 它的外觀光用 CSS 來設定樣式也救不了，而且上傳圖片沒有前端預覽很不直覺。 幸好可以搭配<label元...

自從個人電腦愈來愈普及之後，影音娛樂的應用一直是大家關注的焦點之一。在其中，多媒體的播放功能已經變成基本功能中的基本功能。為了能處理各式各樣的多媒體功能（諸如：錄製、播放、串流、轉換格式、後製處理等），每個平台上幾乎都有設計出一套多媒體框架用來應付各種的需求，像是 Windows 上有 Direct...

mozillian 看了這麼熱血的影片，想必你也迫不及待想成為個 mozillian 吧？！只要有心，人人都能成為 mozillian，如果坐在電腦前的你是個 developer 那就更適合不過了！ 這篇就來告訴你如何貢獻到 mozilla 的 code base。 Step 1：新增 Bugzil...

Mozart 專案是一個利用多個 Web API 來完成的線上遊戲，它使用了 1. Device Motion 來讀取使用者透過手機晃動的幅度, 2. Web Audio 來當成 MIDI 的聲音輸出, 3. Web Socket 來當成手機與伺服器之間的即時通訊。我們只要簡單的搖晃手機，身邊的電腦...

前言: MP4 是目前最常見的影音格式之一，在這篇文章中，我們主要在介紹 container 的格式，以及 MP4 在 Firefox OS 中的現況跟常見問題。 MP4 的 container 格式主要是定義在 ISO/IEC 1449612 [1] 中，從最早期的 Apple Quicktime...

App ManagerApp Manager 最近在 Firefox 瀏覽器有釋出一個新工具「應用程式管理員 (APP Manager)」，只要按照這篇 MDN 文件的步驟下載與安裝 (https://developer.mozilla.org/zhTW/docs/Mozilla/FirefoxOS...

cgdblogo 我們在開發過程中，常常會使用 GDB 來找 bug，但是它是純文字介面，使用上還是有些不便，幸好現在可以找到不少 open source project 來改進這些問題，今天所介紹的 CGDB[[1]](https://cgdb.github.io/) 工具，是我使用過覺得相當好用...

如果你對如何 build Firefox OS 不熟悉，請先閱讀 http://tech.mozilla.com.tw/posts/2786/easy3stepstobuildfirefoxos 。當我們用 config.sh nexus4 下載 source code 完畢，在工作目錄底下會有兩套...

nfcpromo （圖片來源：http://www.androidapk.com/wpcontent/uploads/2013/05/sonynfcpromo.jpg） 想像有一天，看到朋友們拿著手機熱烈的討論著某位正妹的照片，你不用擠破頭跟大家搶手機來看，你只需要將兩隻手機輕輕一碰，正妹的照片咻一...

nanoblock firefox 難得破例不講技術，耶誕節快到了，應該要來點輕鬆的。 狐迷們，今天我們一起用積木來做一隻小火狐吧！ 首先要準備的積木材料如下圖： nanoblockfirefoxblocks 從頭到尾分解步驟 底下開始詳細的圖文分解步驟，只要一步步照著做，很快就可以完成你的積木小火...

iac 在開發 App 的時候，我們有時候需要在App之間傳遞資訊，而今天我們要介紹的主角就是新引入的 WebAPI: IAC (Inter App Communication)，有了這個好東西，我們就可以輕易的在 App 間傳遞訊息，以下就用筆者遇到的例子來說明吧： User story 當使用者...

我就先不賣關子，底下這個 fiddle 就是這篇文章的刮刮樂範例完整版。 可以玩玩看，試著瞭解裡面的程式腳本，或是 fork 來改改看。 有興趣但看不太懂 code 的話， 就跟著本篇文章的介紹帶你入門吧！ 如果大家有看過九月份的「Firefox OS 讓你儘情享受每一刻」活動網頁（註 1）， 應該...

開發前端的程式，一個基本的前端 debug 工具會幫我們及時揭露大部份的 HTML，CSS 和 JS，並且及時改 HTML 與 CSS，為 JS 下斷點，目前各大瀏覽器包括 Firefox，Chrome 以及 IE 都有這方面的支援，我就不在此一一贅述。那今天有什麼好用的工具可以幫助我在 Firef...

85154743dabstractdigitalcodeconnection [1] 問： 常常我們會收到某些 Gecko 的問題，但卻是 log 不足或是可能需要在手機上摹擬某些特殊/額外的資訊才有可能重現問題。而我們又確定這個問題，大概會從 Gecko 的 JavaScript 檔案下手。但是，...

Rhino Art Firefox OS 裡的 Gecko 層，主要是由 C 和 JavaScript 兩種程式語言編寫而成。不過 Gecko 裡的 JS 程式碼長相和我們常見的 clientside JS 非常不一樣。剛開始閱讀程式碼時，常常會看到一些奇妙的玩意。 比方說，JS 裡頭竟然會有 if...

Emscripten Logo 在提到 Emscripten 之前，我們先來回顧一下 JavaScript 的發展歷史。 JavaScript 的歷史 JavaScript 在 1995 年問市時，目標是在瀏覽器中打造一種輕量的腳本語言，用來輔助頁面的呈現以及與使用者互動。為了這個目的，JavaSc...

testdemo.js 在 Firefox OS 中，我們經常使用 marionette 這套測試框架來進行 web API 的測試，當 test case 越寫越多時，開始會有一些 bad smell 浮現，在這邊我們用 telephony 的 marionette test case 為例，看看...

Alan Kay 說： 預言未來最好的辦法，就是親自去實現它。（其實他還說過：想認真搞好軟體的人，最好連硬體也自己來。不過就先讓我們當作沒聽過這回事吧 :)） 10 月 46 日在全球三地同步舉行的 Mozilla Summit，集合了各地前來，包括員工和志工的 Mozillian 成員一起集思廣益...

各種常見的螢幕大小 我們發現到：要讓網頁應用支援多種設備，開發者需要根據設備的「像素密度」（Pixel Density）與「螢幕大小」（Screen Size），處理相對應的「排版」與「圖片」問題。接續前一篇，本篇將闡述處理「螢幕大小」（Screen Size）的方式。 （現在Gaia關於多重設備支...

credit http://en.wikipedia.org/wiki/File:DaVinciVitruveLucViatour.jpg 使用網頁技術開發應用的好處，是讓使用者不管在什麼設備上，只要有瀏覽器支援，基本上都能使用自己習慣的服務。同時若有需要，也可以較容易地透過 Apache Cord...

身為測試工程師，想要管理你的測試項目也是合情合理的。在 Mozilla 使用 bugzilla 來追蹤程式問題以及待辦事項，但如何發現並且驗證這些，便需要測試工程師分析功能以及使用者行為，轉化為測試項目並執行了。隨著時間推進、功能增加，測試項目並非只要將其逐一執行即達到目標，我們需要更好的工具讓不同...

fxos 今天就聽我這小小測試工程師，娓娓道說 Firefox OS 快樂的工作史!! 這根本可以媲美澳洲大堡礁的工作阿！~This is really good and happy job in Taiwan!!! troll2…你還等什麼，快點加入謀智台灣阿，就缺你一個！ ~以上，工商廣告時間結...

（圖片來源：http://www.flickr.com/photos/intelfreepress/8401881183/） 身為一個完全沒碰過藍牙的新手，在加入 Firefox OS 藍牙團隊開始開發後，接觸到的一切都令我感到新奇有趣：包括藍牙的軟體架構及傳輸概念、各種不同用途的 Profiles...

Firefox OS 的誕生早就不是新聞，但是你也許不知道 Firefox OS 早就貼心提供了平易近人的 build code 環境，以免各位在一開始徬徨無助的時候，就被奇怪的 build failed 給嚇跑了。 沒錯只要跟著下面的三個步驟，就可以 build 好 Firefox OS 的 im...

在一些低階的手機中，由於內部多使用僅 512 MB 的 Nand Flash 當作儲存空間，因此無法切割出一塊專門供使用者存放檔案的空間，這時就需要仰賴外部儲存的支援，也就是外接 SD Card。一但有了這項支援，OS 就必需提供一個機制用來偵測並自動掛載插入的外部儲存裝置。另一方面，為了方便使用者...

MeettheFirefoxOSMascotaFoxThatsonFire 二十餘年前，網站慢慢開始出現在世界各地，起初就像盤古開天闢地一般，沒有複雜的東西，網站都相當簡易，大多以文字和些許的圖片構成，連頁面也沒有太多。經過好一陣子的發展，慢慢有了比較複雜的結構，那時候人寫網頁的邏輯慢慢的會受到干擾...

Scalable Vector Graphics (SVG)，可縮放向量圖形，是一種 XML 標記語言，用來描述二維向量圖形。SVG 對一般使用者而言， 也許是個相對陌生的名詞，但是我相信大家一定聽過 Adobe Flash，SVG 跟 Flash 一樣，其特點都是使用向量圖形，與事件觸發高度整合，...

在先前的文章當中，有跟各位讀者介紹過 Firefox Os Emulator 和 Marionette tests，也有進一步討論如何 Hacking Firefox OS emulator。想必各位都很了解 Emulator 和 Marionette 對 RIL (Radio Interface ...

在 Firefox OS 系統中，若 b2g process 發生 crash 時，一般來說是透過 gdb debugger 來除錯，但現實生活中並不是每次系統 crash 都有機會知道複製步驟，能夠將問題重新複製。因此事後針對 gecko crash 分析對於 platform 工程師來說是相當重...

notification bar 當使用者從 Firefox OS 手機收到一封新簡訊，在點下 Notification Bar 的簡訊通知後，預載的 SMS App 就會被啟動，但你知道在此過程中，預載的 SMS App 是如何切換到正確的簡訊串列來顯示簡訊內容的呢？ 首先，使用 navigato...

where 相信不少人胡思亂想的時候，都曾問過自己這三個問題。似乎思考了這些問題後，人生就豁然開朗了。而自從參與 Firefox OS 專案以來，無論私下和朋友聊天，或在公開場合向別人介紹，總少不了面對各式各樣的疑問。讓我們以這三個基本問題為切入點，一起深入瞭解 Firefox OS 以及其背後的理...

一個月前我們在 Computex 2013 發表了 Firefox OS 在平板上的預覽版，吸引了不少人的目光。(如果你還沒看過，本文最後有精華短片。) 6024565255007941759841995303978n 雖然只是展示機器，但是當拿在手裡，身為工程師的我們，都會興奮的想讓它變成真的可以...

雖然 Firefox OS 以 Android 無法深入開拓的低階手機為第一波市場主打，但這可不表示 Firefox OS 只能在小螢幕上執行。目前 Firefox OS 已初步支援 HVGA (320×480)、WVGA (480×800)、qHD (540×960) 三種解析度。以 Web 技術...

在開發軟體的過程中，難免會碰上 memory leak 或是碰上需要減少記憶體使用量的情況。碰到這種事情時，我們會需要 memory allocation 的 footprint，才能夠找出問題點。開發 Firefox 桌面版、Firefox for Android，或是 Firefox OS 的過...

培樂多黏土早餐 （圖片來源：radiobread） 六月的時候 Askeing 大大介紹了 Python 開發好幫手 – virtualenv，如果你剛好是 Python/Django 的新手，能照著 Askeing 的解說順利地完成 virtualenv 安裝使用，那麼這篇文章可以給你一個自己學習...

截止目前為止，Mozilla 的 IPC 在我心目中依然是個仰之彌高，鑽之彌堅，瞻之在前，忽焉在後[1]的神秘技術，雖然簡單地說，它就只是 Content Process 和 Chrome Process 溝通橋樑…而已（心虛）。 有了 IPC 這座橋，接下來是讓程式設計師知道如何利用 IPC 這座...

所謂的 ECMAScript，其實就是我們日常在用的 Javascript，只是當初因為商標的問題，所以後來把這個語言的規範改叫作 ECMAScript。目前市面上的瀏覽器已經支援到 ECMAScript 5，也就是 ECMAScript 262 5th Edition了。但 ECMAScript ...

許多開發者常會使用 schroot 去管理不同的獨立環境來符合自己的開發與編譯上的需求。 在 Python 的世界也有類似的工具 – virtualenv[1]，可以讓使用 Python 的開發者方便快速的建立各自獨立的虛擬環境。在獨立的虛擬環境中開發 Python 程式，可以降低各個環境中的套件數...

功能簡介 Alarm API 最初是為了 FireFox OS (FFOS) 所特別開發的一種 Web API，可以在預定時間自動喚醒系統去執行特定作業；這種功能可以套用在許多實際的應用上，最容易聯想到的功能就是 Alarm Clock 的應用，有了這個 API 我們就可以要求 FFOS 在某個時間...

在桌面版本的網頁開發中，我們可以透過 HTML5 的 page visibility API 來知道目前的網頁是否為使用者焦點，或者目前不可為使用者所見，來達成某些目的：如停止 UI 更新，資料交換…等，範例程式如下： function handleVisibilityChange() { if (...

XUL Runner 算是 Firefox 的兄弟之一，他允許我們用 Gecko 內部的元件設計一個擁有自己外觀(而不一定需要長的像是 Firefox)的應用程式。因為 Gecko 內部元件非常的豐富，而且 XUL Runner 也有跨平台的能力，使用 XUL Runner 可以簡化我們開發應用程式...

FireFox OS 作為一個基於 Web 技術的作業系統，提供了許多 Web API 讓 app 開發人員可以存取手機的硬體、系統與個人資訊，然而這也帶來新的安全性的挑戰。為了降低系統弱點被利用的損害與增進系統安全性，FireFox OS 將每一個 app 執行在獨立程序 (process) 之中...

整個 Mozilla 的軟體開發流程中，有個非常重要的 Bug 追蹤系統 – Bugzilla 。在 Bugzilla 中，能讓世界各地所有人提出 Bug、提出個人的看法、以及提出解決 Bug 的 Patches。也因此，整個溝通體系架構是相當龐大。且為了找出真正的問題點，提升整個軟體的成熟度穩定性...

用過 Firefox 等 Mozilla 系列瀏覽器的朋友，或許知道 Mozilla 瀏覽器都內建一份 about:mozilla 頁面。該頁以深紅色為底，節錄一本不存在的《Mozilla 之書》，以基督教聖經的語調講述 Mozilla 的歷史。 在 Netscape/Mozilla 的歷史中，ab...

在前篇文章中，我們曾經提到藍牙相關的「配對」以及「連線」的概念。讓我們先來快速複習一下！ 配對 (Pair) ：與社群網站的「加入好友」機制一樣，由一方發起，另一方認可。完成此步驟後，雙方便是經過認證的好友囉！此後就可以開始進一步的互動，例如：連線。 連線 (Connect) ：雙方在完成加入好友的...

一個好的軟體會隨著時代的變遷不斷的演進，為的就是帶給所有用戶『更新、更好、更強大』的使用經驗，因此自動更新機制便是現今軟體不可或缺的功能。Firefox OS 運用了 Firefox 的核心程式碼，自然繼承其自動更新機制，以下就來詳細介紹一隻搭載了 Firefox OS 的手機如何進行更新。 Fir...

目前 Gecko 已經有實作相當多的事件，可供一般 Web 程式開發者使用，但如果在開發 FireFox OS 應用程式時，需要在 DOM 物件中，傳遞新的事件給 web application，如系統電量變化、使用者開關螢幕、耳機插拔等等行為，開發者該如何用最有效率的方式，傳遞這些資訊給應用程式端...

在手機上面，Application 的實作往往會影響到效能好壞以及是否夠省電，其中 Application 的 CPU 使用量會是一個非常關鍵的因素。 以下就拿使用 Firefox OS 的手機來做舉例說明，首先透過下面的 top 指令，可以看到整體 System 以及 Application 的 ...

你習慣用手指在螢幕上滑來滑去，用手勢 ( gesture ) 代替你處理大小事嗎？ 在現今行動裝置的世界裡，手勢 ( gesture ) 儼然成為與裝置溝通的最主要管道。無須其他的輸入設備，動動手指就可輕易將手中的手機或平板操控自如。不管是 Android 、iOS 甚至 Windows 都有針對手...

先節錄一下 OpenCL 在維基百科的介紹 OpenCL (Open Computing Language，開放計算語言) 是一個為異構平台編寫程式的框架，此異構平台可由 CPU， GPU 或其他型別的處理器組成。 OpenCL 由一門用於編寫 kernels （在 OpenCL 裝置上執行的函式）...

大家都知道 JavaScript 是一個很方便的語言，想要一個新物件? 沒問題，new 一下就有了。需要一個陣列來做暫存空間? 也是交給 new。不像其他，比如說 C，等較低階的語言，JavaScript 的使用者絕大多數時候都不必煩惱實際上資料被放到什麼地方，也不需擔心用完了卻忘記要交還給系統而造...

自從指考分發到資訊系後，掐指一算也過了十個年頭了。 在這十年的過程中，除了敲敲鍵盤 coding 以外，我的 CS 人生也就此開始… 學以致用，相信大家都聽過這句話，不過宇宙人我可是把 CS 學到的東西實踐到日常生活中呢!! 電梯篇: 搭電梯時，一定要做的兩件事那就是 1.按樓層 2. 按關門。 想...

今天要來聊聊在 Firefox OS App 的測試，在開發前期，大部分的測試還是仰賴測試人員進行手動測試，然而，大量進行重覆測試其實是很消耗時間的。為了節省開發和測試上的時間，我們也開發了對應的測試工具，以提升開發的效率。 在網路上，你可以找到有關 marionette automation fr...

相信很多人都看過之前對於 WebRTC 的簡介，我們這次就稍為深入了解一下如何讓 Firefox 執行 WebRTC，以及 WebRTC 的運作流程。目前Firefox Nightly的版本已經有支援 WebRTC，想嘗鮮的朋友可以下載後到 about:config 將 media.peerconn...

大家一定很好奇，Firefox OS – 這個由 Mozilla 世界各分部所共同打造的行動 OS，在開發的期間都是工程師們各自默默的坐在辦公室埋頭苦幹，每天只靠 Email 或是視訊討論問題嗎？ 如果你這麼想就小看在 Mozilla 工作的迷人之處了！在 Firefox OS 開發的過程中，每個軟...

HTML5 中引入了許多全新類型的 input field，讓開發者能夠輕易地利用 type，自定這個 input 是用來輸入 email、URL 又或者是時間等等的資訊。 輸入網址： 輸入email： 輸入日期： 輸入時間： 詳見 MDN – type Attribute 同時，瀏覽器也能針對不同...

單元測試一直以來都是確保軟體品質的一種方式，在日益錯綜複雜的軟體中更是重要。Firefox OS 的應用層 Gaia 理所當然的也由單元測試來確保軟體品質。設置妥當後，當你打開任意編輯器對 Javascript 檔案編輯，並且按下『Save』的那一刻，unit test agent 就會默默的被喚起...

今天搶先和大家聊聊 Firefox OS 的畫面顯示的流程。Firefox OS 是基於 Android BSP (Board Support Package) 的系統而又有很多不同。而我們的顯示部分也跟 Android 所採用的 SurfaceFlinger 完全不同。 首先我們先來看看簡化很多的...

不論是哪個語言的程式設計師，都時常需要和語言或是框架的字串 (String) 打交道。舉凡傳遞訊息、寫 log，或當作資訊來儲存等等都會用到。今天就來和大家聊聊，在 Firefox OS 裡面，string 是怎麼被使用的。 Internal string / External string 首先要...

《Mo語》：「不學 Emulator 無以 test；不寫 test 無以 land！」 之前我們介紹過 Firefox OS Emulator，也聊過如何使用 Marionette 來為 Firefox OS 寫測試項；今天我們來研究一下如何為模擬器新增功能來協助開發 RIL (Radio Int...

在開發網頁程式時，當我們想要提供一個選單，可以讓使用者能在選單中選取他們想要的選項，基本上會非常直覺地想到 <select 標籤。相同的，當我們在 Firefox OS 上開發 APP 有類似的需求時，也會直覺地想用 <select 標籤來實作這一個功能。原有 Firefox UI control ...

今天我拿到了一隻新的手機，手機上運行的正是大家所熟悉 Android 系統。我的任務是將 Firefox OS 移植到這一隻新的手機上，這個工作對我來說非常有趣，因為透過 hacking 的方式可以讓我更了解 Firefox OS 這個火紅的作業系統。以下將分幾個部份來逐步地描述 hacking 的...

注意：本篇討論 Gecko 內部 DOM bindings 的實作，可能會有比較多的程式碼。 目前網頁的通用語言是 JavaScript，可是主流瀏覽器大多由 C++ 開發實作，DOM bindings 就是一些處理如何從 JavaScript 引擎使用以 C++ 實作的 DOM API 的程式碼。...

Profiling 這個技術可以提供系統執行時的歷程，讓我們評估並找出系統效能的瓶頸。Firefox OS 目前提供了 builtin profiler， 我們可以利用 profile.sh 這個 script 來幫助我們從 device 擷取 profiling information，並且利用 ...

香蕉人又登場了，今天要來教大家使用 Persona 囉！這是什麼? 能吃嗎?! 是新口味的香蕉嗎？！ 有在發落Mozilla Taiwan 部落格的捧油應該不陌生啦，新朋友別緊張啦~ Persona 的詳細介紹可以看 http://blog.mozilla.com.tw/posts/1061/安全可...

這段 Code 寫得好漂亮喔！ 如果你從來沒寫過程式，大概會覺得工程師不只宅還是神經病。也許這跟我去看骨科，結果醫生對著我的X光片讚嘆『你有一個漂亮的脊椎』是差不多的心情（但是我絕對沒有覺得醫生很神經）。 運算結果正確，會動會跑，還不是都一樣？當然不一樣，你難道希望你的憤怒鳥丟出去，結果三分鐘後才打...

Mozilla Taiwan 的 RD 們正致力於開發 Firefox OS，在專案開發的過程中，享受著把 bug 一一吃掉的小成就，也常有出乎意料的小插曲伴隨著我們。 某天早上，我依照慣例地更新自己的 code base ， build 完刷到手機上正準備來試試時，卻發現螢幕是一片黑，什麼畫面也沒...

開發 Mozilla 專案主要會使用兩種程式語言：C++ 與 JavaScript。第一次接觸到這份代碼時，我心中就產生了一個疑問：C++ 是強型態、靜態編譯的語言，而 JavaScript 則是弱型態、直譯式的語言，這兩種特性截然不同的程式語言該如何溝通呢？以下讓我們來分析一下 C++ 與 Jav...

之前的文章大都集中在 Firefox OS 運行時的討論，而今天就讓我來平衡報導一下 Firefox OS 運行前的其中一個工作好了，那就是編譯系統；首先要提到的就是 Firefox OS 利用了來自於 Android 的編譯系統，因此 Gaia 和 Gecko 就必需做適當的配置以加入到編譯系統裡...

在 Firefox OS 平台上，一個 App 其實就是一個 iframe。Gaia 團隊成員 (Frontend engineer，簡稱 F2E) 會小心翼翼的檢閱著 UX 設計出來的 wireframe (示意圖)，對照 Gecko Developer (以下簡稱 Dev) 提供的 API，把 ...

過去的工作一直都是跟 broadband network 相關，整天看的都是網路封包 (network package)，檢查封包從 network device 收進來的 formate 對不對? 封包被改得對不對? Network package 走的路徑對不對? Forwarding 的效率夠...

由於科技不斷發展，無線技術的應用已日趨普及，其中 wifi 當然是無線產品不可缺少的一個應用。本文主要描述在 wifi 開發過程中曾經遇到的問題以及分析，希望可以藉由此篇文章來幫助 wifi 開發者分析問題。 wifi 啟動流程 系統根據以下流程開啟 wifi 載入 wifi kernel modu...

有看過 Gecko 的 C++ Source code 的人，一定見過這個東西：nsCOMPtr，有很多物件的指標都會被儲存到這類物件裡面，也猜得到他和指標有關係，但這東西到底意義何在？其實他就是 Gecko 裡面眾多 smart pointer 的一種。 C 和 C++ 語言中，令人頭痛的問題之一...

Web activity 是由 Mozilla 設計並開發，用來使 web app 之間共享資源的框架。在 Firefox OS 中已經存在 Platform/UI 上的實作，並且有一些內建的主要 Web app 已經利用 Web activity 來達成跨應用程式溝通的目的。（如：Gallery ...

又是另外一個執著於把問題解決才想回家的夜晚，等著程式編譯好的同時，不妨來談談我的程式夢。但在這之前，我想我必須先釐清一下一般人對於寫程式的迷思，那就是：千萬別對寫程式這回事懷抱任何美好想像，它其實一點都不像電影裡所演的那樣優雅，駭客緊盯著螢幕敲敲鍵盤就能運籌帷幄、呼風喚雨，在一個真實的世界裡，等著你...

在 HTML framework 技術突飛猛進的今日，我們嘗試著用新的 HTML5/CSS3/JavaScript 來完成更多的事情。Chrome Web Store 裡就有各式各樣的 Web application 來告訴你目前 HTML framework 的能耐。除了視聽娛樂輕鬆實現的應用外，...

謀智台客曾在五月份時為各位介紹 Firefox OS (原 Boot To Gecko, 簡稱 B2G) 的模擬器 — B2G on Emulator。今天則要就模擬器進行進一步的說明，與各位分享如何基於模擬器和 Marionette automation driver 進行 Boot To Gec...

接續上週的介紹，今天來談談，為~~~什麼我們要多用 CSS 而少用 JS 來做動畫呢? 原因之一，就是今天的主角 media queries 啦！Media queries 主要可以用來對付來自四面八方，奇奇怪怪的解析度。 你或許會問，這些奇奇怪怪的解析度打哪來的呢?! 除了現在人手 N 支智慧型手...

一個「生動」的網站絕對少不了 Javascript (JS) 的幫忙，很多有趣的特效交給 JS 或甚至丟給 Jquery 就對了！不過我們仔細看看 JS 裡到底做了什麼事讓我們的網站活起來呢，其實大部分的特效，JS 只是幫我們動態的去改變元素的 CSS 而已。那可以直接就在 CSS 中完成特效嗎？！...

Gaia 是一個基於 HTML5 技術為基礎，且為 Firefox OS ( 原 Boot to Gecko 專案，以下簡稱 B2G ) 手持系統而生的，使用者界面開發專案。開發 Gaia 的程式語言不外乎使用 HTML5/CSS/JavaScript 等技術，這更是一個不折不扣的 Web 應用程式...

正如之前幾篇謀智台客文章所介紹的， Firefox OS (Boot to Becko, 以下簡稱專案名 B2G ) 計劃提供了一個全新的平台，讓開發者能夠以 HTML5 等網頁技術來開發各種行動應用 (mobile apps)。這對於開發者眾多且已累積多樣化 JavaScript library ...

一早打開電腦，更新一下 code，一如往常build 完 update 到手機上去，跑了一陣子之後畫面閃了一下，Firefox OS (以下簡稱專案名B2G) 該不會重啟了吧！為了證實我們的疑慮，我們開啟 log 來看看，結果在 log 裡面看到 “Fatal signal 11 (SIGSEGV)...

目前 Firefox OS (以下簡稱專案名B2G) 已經支持的設備包括： Samsung Galaxy S2 I9100 (以及兩款 SGS2 variants：I9100G，Skyrocket) Nexus S Maguro/Akami Emulator 除此之外，還有好幾款設備正在進行 por...

相信關心「謀智台客」的各位對於 Firefox OS (Boot to Gecko, B2G 專案) 都有基本的認識了（還有問題的可以趕快閱讀由 timdream 哥發表過的「關於 B2G 計畫，以及 Web 的誤解」），但這麼龐大的專案會是兩三個小伙子躲在車庫就搞出來的嗎？ 答案當然不是！其實主要...

俗話說得好： 每個偉大系統背後都有個好用的 Thread 機制，Gecko 也不例外，本篇台客文就是介紹在 Gecko 裡 thread 的一些基本使用方式及相關的 class 。 首先， Gecko 內部的 thread 基本上是使用 nsIThread 這個介面，透過 NSNewThread 來...

如大家所熟知，JavaScript 是一種具有許多特性的動態語言，能應用於 metaprogramming ，換句話說，其可以操作程式及改變程式。Metaprogramming 的能力在於動態 (runtime) 改變和定義程式的行為，具有高效率的表達程式結構和邏輯的優點。然而，metaprogra...

事實證明不需要開 PS3 也可能拖稿。 早早設了鬧鐘，想趁早來個「單騎強登枕頭峰，孤帆勇渡棉被海」，落筆如有神…，直到 X window 吐了一行： Fatal server error: <emcould not open default font</em '<emfixed</em' 1 Fat...

前陣子接到一個新任務，就是要把 B2G 移植到新的 Samsung Galaxy S2 手機上。雖然這支手機也是 Galaxy S2，不過，他的 model name 是 GTI9100G ，跟台灣市售的 GTI9100 是完全不同的平台，有興趣的朋友可以參考這裡。移植的過程中碰到了不少問題，在看到...

Mozilla Firefox 的程式大部份是用 C++ 寫成，但也有不少的元件是以 JavaScript 完成，在開發 B2G 的時候免不了就要寫一些 JavaScript。 在跌跌撞撞的參考 Mozilla 的 Coding Style Guide 完成 patch 並接受 review 之後，...

大家好！我是愛笑愛開槓愛看棒球愛打網球愛寫程式而且最愛台丸的謀智台客──艾瑞克。 初次見面，請多指教。m(.)m 今年一月，我成為 Mozilla 台灣的一員，其實沒想到自己會這麼快就進外商工作，以前常聽人說「某某某進外商工作了耶」，感覺那位某某某就是很有經驗的樣子，但我仍然未達而立之年（謎之聲：好...

各位對 Boot to Gecko 有興趣的 Developers/Hackers： 如果您有參加上週六的JSDC或是四月中的 OSDC ，有逛到 Mozilla 的攤位，或者是 OSDC 當天有去聽 Thinker 介紹 Boot to Gecko 的演講，想必對 Boot to Gecko 已經...

過去的幾個月中，我常在不同的場合被問到一些關於 Boot to Gecko（B2G）專案的問題。我想在這裡整理一下一些常見的，以及對於 Web 本身的誤解做為解答。 誤解 1：Boot to Gecko 是另一個手機 APP 開發平台 錯！如果想在 B2G （或任何有瀏覽器的手機、平板）上面執行您的...

Omega Feng UX Team 編輯 Firefox OS UX designer 李YY Media Team 編輯 擅長 C++，負責 Firefox OS 中 WebRTC 功能 愛聞插低 Frontend Team 編輯 擅長 JavaScript， 從事 Firefox OS 前端開...