用Firefox 4、Google Chrome玩任天堂、Game Boy模擬器遊戲

jsgb-06jsgb-07

Mozilla是開發Firefox瀏覽器的社群,而這個社群中有個實驗室叫做Mozilla Labs,這裡專門提出一個特別的研發專案,嘗試設計一些新式的工具或服務,例如Firefox Sync就是從Mozilla Labs成功畢業的一款同步工具。而Mozilla Labs最近有一個新的研發活動:「Gaming」,你說瀏覽器和遊戲有什麼關係?其實關係可大著呢!

有鑑於Google Chrome、Firefox 4紛紛對HTML 5有更好的支援,並且提供了更快速的Javascript引擎,因此Mozilla認為未來立足於這些技術的網頁遊戲將有機會大放異彩,所以他們提出了「Games, Meet Web」這樣的口號,提供一個競賽、一個交流技術的平台,讓「網頁遊戲」可以從目前已經非常普及的Flash遊戲,更快朝向HTML 5等多元技術所帶來的新革命邁進。

你可以關注「Mozilla Labs Gaming」的部落格,會陸續看到他們推薦一些活動中發現的有啟發性的遊戲設計(例如這個撞球遊戲),而今天我則是看到「A lower level: Making jsGB」一文,介紹了一個利用HTML 5、Javascript所製作的「Game Boy模擬器網頁版」,讓我們可以直接上網就能載入各種令人回味的掌機遊戲來玩,非常有意思。

 

這也讓我想起之前介紹過的「Google Chrome 變身任天堂模擬器,上網玩紅白機經典老遊戲」,同樣利用HTML 5、Javascript技術把模擬器放入網頁中,我們可以直接在網頁版模擬器中載入不同新遊戲來玩。

在Mozilla Labs Gaming的文章中提到,利用HTML 5來製作網頁版遊戲模擬器有不少優點,一方面沒有必須安裝額外軟體、插件的困擾,因為新世代瀏覽器都內建支援,另外一方面對於鍵盤操作的反應也比較優秀(現在可以看到的是GB和紅白機,或許以後超任、PS 2、Wii的模擬器都能放入網頁中)。

而更重要的是新世代瀏覽器都擁有更快速的Javascript引擎,有辦法驅動這些遊戲,讓遊戲呈現的變化更豐富,但又能保持流暢的遊玩速度。

 

可見以後網頁遊戲技術將面臨更多畫面、特效、操作互動的革新,而如果你對這樣的實驗有興趣,那麼就先來玩玩看這兩個GB、紅白機的網頁版模擬器吧!

當然,為了保持流暢的遊戲速度,Firefox 3.6.12、IE 8這些瀏覽器目前都無法正常遊玩;我們必須使用Google Chrome瀏覽器,或是還在Beta的Firefox 4才能以合理的速度玩遊戲。

有趣的是,當我使用Google Chrome和Firefox 4來測試時,發現搭載最新JägerMonkey引擎的Firefox 4,在遊戲速度上比Google Chrome Canary最新版更加流暢,再次證明我之前所說的:「讓我們跟著 Firefox 4 加速吧!SunSpider測試速度追上Chrome」,現在Firefox 4在速度上已經不完全是落後者了。

 

在Google Chrome Canary上玩GB掌機模擬器,平均每秒fps為58.95。

jsgb-01

而在Firefox 4 Beta 8pre中玩GB模擬器,可以跑到平均每秒60.93fps,確實可以感覺遊戲流暢許多。

jsgb-02

 

如果用Google Chrome Canary玩紅白機模擬器的話,每秒fps為49.08,這會感覺到一點點的不流暢。

jsgb-04

反而當用Firefox 4 Beta 8pre玩紅白機模擬器時,每秒可以跑到56.86fps,保持了較流暢的遊戲速度。

當然,每種不同網頁工具、服務所運用的技術架構不同,而不同瀏覽器執行時就可能出現速度變化,我們不能因為單一工具或測試就斷定哪那個瀏覽器比較快。

最重要的還是這些瀏覽器都能持續優化自己的技術引擎,讓以後我們可以直接上網就享受更豐富、更多元、更流暢的五花八門網頁工具。

jsgb-05

留言

  1. 我的Google Chrome玩紅白機很順阿
    58 fps

    Google Chrome
    8.0.552.210 beta

    回覆刪除
  2. 感謝你分享自己測試的數據,
    那不知道如果你的電腦上用Firefox 4來跑的話速度是多少?

    其實我也覺得我那台電腦測出來的chrome玩紅白機模擬器的速度有點落差太大,合理來說不致於如此

    所以應該是硬體或系統本身的其它影響吧,但可以看到的是同樣環境下Firefox 4稍快了一點點

    回覆刪除
  3. 我的是Firefox4比較慢..
    AMD athlon 64 X2 4000+ 2.1GHz
    Chrome 7.0.517.44
    Firefox 4 beta 7

    Gameboy(Mario land)
    Chrome7:60.31
    firefox4:49.15

    紅白機(Dr.Mario)
    Chrome7:58.71
    firefox4:56.57

    Fx4的Gameboy明顯有遲緩…

    回覆刪除
  4. 恩恩,感謝回饋

    Firefox 4 beta 7已經有內建新的Javascript引擎,所以可以看到速度上不致於慢太多。

    至於和我測試結果的差別,不知道是不是因為我使用Firefox 4 beta 8 pre的最新版測試的關係?

    回覆刪除
  5. Re1:

    跑了一下Firefox 4.0b7
    數值不太穩定,在50~58間跳動,偶爾掉到46,數值掉下去也沒卡住的感覺,蠻順的。

    以上都是在只開一個瀏覽器,一個網頁,其他程式幾乎關光光的情況下執行。

    Ubuntu 10.04
    Kernel Linux 2.6.32-24-generic

    Memory:2GB
    Processor:Intel Pentium Dual CPU E2180 2.00GHz

    回覆刪除
  6. 火狐越來越誇張囉

    回覆刪除
  7. 要使用搖桿的話可以使用這個軟件: JoyToKey

    回覆刪除
  8. 我的好慘喔!

    用 Firefox 4.0b7 玩紅白機的 Super Mario Bros. 不開音效不 zoom in 也才 30 FPS 左右而已,開了音效加放大更慘,只剩下將近 20 FPS,超級慢!!

    回覆刪除
  9. 硬體效能應該也是有影響的

    另外我測試時使用的是firefox 4.0 beta 8pre,應該在速度上有更好一點

    回覆刪除
  10. 本人硬體為:AMD phenom2 X6 1055T,4G RAM,9600GT
    Gameboy(Mario land)
    Chrome7:61-62
    firefox4:62-63
    兩個版本都是最新更新的

    回覆刪除
  11. 和硬體的效能也很有關係~

    回覆刪除
  12. 硬體效能有關的可能性較小,畢竟FC或GB的模擬器幾乎隨便的機器都跑的起來
    smart手機來跑也順的很,應該使用的PC還沒差到這種程度吧
    不如說看電腦後面的系統,背景程式在做什麼事

    還有Google Chrome本來就還算是比較無負擔陽春的瀏覽器
    和firefox比,自然在執行一件較需要一點CPU或說硬體效能的事上會贏
    就像Windows和純文字模式下的Linux做同一件事一樣
    不過最主要的還是前面說的那樣

    回覆刪除
  13. to 15 樓:

    其實你好像不明白這個 HTML5 模擬器的特別之處,這個模擬器跟平常模擬器的不同之處是它是用了 Javascript 去寫哦,本身執行 JS 就是一個很像模擬機的東東,你可以大約想象成一台模擬器裹執行另一台模擬器,而效能又十分優秀,比其他模擬器用硬體加速來執行更有意義

    而 Chrome 成功之處就是把(介面上)不必要的東西都拿走,瀏覽器本身就是瀏覽器吧,最重要的是上網速度快,安全性高,上網時網頁內容應該才是最重要,其他不必要的標題列、狀態列就算給多了也沒用吧,而且 Chrome 是這麽多家瀏覽器中,支援 HTML5 得最完善的一個,而且內建了受保護的 Flash Player(不用額外安裝!),亦別忘了它是唯一一個沒被駭客攻陷的瀏覽器,

    回覆刪除
  14. 事實上google chrome有在比賽中被駭客攻陷過...........

    回覆刪除
  15. 承上:
    的確是,但是駭客說明:無法被有效利用!

    回覆刪除
  16. 駭客目前還無法突破沙盒機制

    回覆刪除
  17. Chrome支援HTML 5最完善?何以見得...

    回覆刪除

張貼留言

為了避免垃圾廣告留言過多,開始測試「留言管理」機制,讓我可以更容易回應讀者留言,並更簡單過濾掉廣告,但只要不是廣告留言都會通過審核。

這個網誌中的熱門文章

全家沖印、 7-11 列印照片誰好用?立可得與 ibon教學+比較表

微軟 Bing AI 繪圖工具 Image Creator 免費開放,30秒輕鬆生成圖片

Arc 瀏覽器 windows 版測試心得,用四大介面改造升級專注工作流

Google Maps 我的地圖完全教學!規劃自助旅行攻略

個人知識管理的時間平衡心法,忙碌中我如何維持高效率輸入輸出

5 條「這時候,不要做」清單打破無意識行動模式的低效率循環

如何用 ChatGPT 加速生成一份有圖有文的簡報,實戰案例教學

Google 表單的 10 個專業問卷調查設計秘密教學

ChatGPT DALL-E 3 的7個特殊 AI 繪圖應用教學,勝過 Midjourney