好奇！僅 13kB 大小的游戲，源碼長(zhǎng)啥樣？

個(gè)馬賽克風(fēng)格的表情正好 13Kb，有人竟然能用一個(gè)表情大小的空間，制作個(gè)游戲出來。我就不信這么點(diǎn)的地兒，能寫出個(gè)花來？游戲能好玩嗎？因?yàn)檫@些游戲點(diǎn)開就能玩，我抱著試一試的心態(tài)把玩了一會(huì)。

事實(shí)證明是我的無知限制了我的想象力，這些 13kB 的游戲并沒有我想的那么簡(jiǎn)陋和無聊。它們不僅有豐富的圖像，還有音樂、物理、重力系統(tǒng)，包含射擊、益智、技巧等不同的類別玩法多樣，令我眼前一亮！

下面我就整理出了 3 個(gè)我覺得好玩的游戲，并附上了在線體驗(yàn)的地址以及 GitHub 上的源碼。

大家先體驗(yàn)一下游戲，后面我們?cè)倭倪@些游戲都用到了哪些開源項(xiàng)目。

1、Space Huggers（太空保護(hù)者）

射擊類游戲，消滅所有敵人。通過外接手柄可進(jìn)行多人游戲，最多支持 4 個(gè)人。不僅如此還有敵人和道具系統(tǒng)以及雨、雪、血、爆炸、武器、水等粒子系統(tǒng)。手機(jī)端操作需要外接手柄。

操作：

WASD 或方向鍵：移動(dòng)、跳躍和攀爬
Z 或左鍵單擊：射擊，大多數(shù)東西會(huì)破裂，有些會(huì)燃燒
X 或中鍵：滾動(dòng)，短暫的無敵狀態(tài)，還可滅火
C 或右鍵單擊：手榴彈，每條命有 3 個(gè)
還可最多連接 4 個(gè)進(jìn)行合作游戲！

敵人類型：

新兵（綠色）：遲鈍，只需要 1 擊
士兵（藍(lán)色）：正常的速度，需要 2 次攻擊
船長(zhǎng)（紅色）：可以更頻繁地爬墻和跳躍，需要 3 次攻擊
專家（白色）：經(jīng)常跳躍和滾動(dòng)，需要 4 次攻擊
爆破專家（紫色）：投擲手榴彈且不會(huì)著火，需要 5 次命中

試玩：https://js13kgames.com/games/space-huggers/index.html
源碼：https://github.com/KilledByAPixel/SpaceHuggers

2、Black Hole Square（黑洞廣場(chǎng)）

益智類游戲，把所有塊清除則過關(guān)。

操作：向左劃開始游戲，點(diǎn)擊塊會(huì)向箭頭方向移動(dòng)，塊進(jìn)入“黑洞”則被清除
支持移動(dòng)端

試玩：https://js13kgames.com/games/black-hole-square/index.html
源碼：https://github.com/Quinten/black-hole-square

3、PACKABUNCHAS

益智類游戲，用提供的形狀拼出指定的形狀，

操作：點(diǎn)擊旋轉(zhuǎn)，拖動(dòng)圖形
支持移動(dòng)端

試玩：https://js13kgames.com/games/packabunchas/index.html
源碼：https://github.com/MattiaFortunati/packabunchas

Js13kGames 是什么

以上這些游戲都是 2021 Js13kGames 的參賽作品，這個(gè)比賽每年舉辦一次，要求參賽者在為期 30 天的時(shí)間里用 JavaScript 做出一款體積小于 13kB 的 HTML5 游戲。

30 天用 JS 做個(gè)游戲并不難，難點(diǎn)在于如何讓游戲小于 13kB。壓縮游戲體積可以從以下四個(gè)方面入手：

游戲引擎
壓縮代碼
圖像和聲音

下面介紹的這些開源項(xiàng)目，在 Js13kGames 很多參賽作品中都能看到它們的身影。

Ga（游戲引擎）

一個(gè)輕量級(jí)、極小(6.5kB)、容易上手的 JavaScript 游戲引擎，可用于制作 HTML5 游戲或任何 2D 動(dòng)作游戲。

https://github.com/kittykatattack/ga

Kontra（游戲引擎）

專注于小體積的 JavaScript 微型游戲引擎，它雖然小但是提供了游戲常用的操控、事件、循環(huán)等核心功能。

https://github.com/straker/kontra

壓縮代碼

壓縮代碼通常是減少空格和換行之類的無用內(nèi)容，從而達(dá)到減少代碼所占體積的目的。

Google Closure Compiler：https://github.com/google/closure-compiler
MiniMinifier：https://github.com/xem/miniMinifier

Piskel（圖像）

簡(jiǎn)單易用的在線像素圖像制作工具。

https://github.com/piskelapp/piskel

miniMusic（聲音）

可以把音效轉(zhuǎn)化成 JavaScript 的項(xiàng)目，通過這種方式能夠有效地減小聲音的“體積”，還支持在線可視化的操作方式編輯和生成音效。

https://github.com/xem/miniMusic

看到這里你是不是也蠢蠢欲動(dòng)地準(zhǔn)備寫個(gè)小游戲了呢？

最后

隨著科技的發(fā)展，存儲(chǔ)空間已經(jīng)不再“捉襟見肘”，我們?cè)诰幋a時(shí)也不用再“斤斤計(jì)較”。但如今看到有這么一群極客，在絞盡腦汁用 13kB 完成一個(gè)游戲時(shí)。我從最初的好奇和難以置信，再到看到他們的游戲和源碼后感嘆他們高超的編程技巧，最后開始反思自己在編碼時(shí)對(duì)性能和損耗方面思考的太少。感謝這些開源項(xiàng)目讓我大開眼界，也讓我發(fā)現(xiàn)了自己的不足之處。

本期推薦的開源項(xiàng)目代碼量不多，適合新手學(xué)習(xí)和上手游戲編程，感興趣的讀者可以試著用它們寫個(gè)小游戲。

以上就是本文的全部?jī)?nèi)容，如果你對(duì)本期推薦的開源項(xiàng)目感興趣歡迎點(diǎn)贊、轉(zhuǎn)發(fā)，讓這些優(yōu)秀的開源被更多人發(fā)現(xiàn)和喜歡。這里是 HelloGitHub 分享 GitHub 上有趣、入門級(jí)的開源項(xiàng)目。歡迎留言和我分享開源項(xiàng)目～

- END -

ello！這里是W3Cschool編程獅的小獅妹。

游戲開發(fā)一直以來都是編程領(lǐng)域中備受關(guān)注的一個(gè)重要方向。想象一下，在虛擬的游戲世界里，你可以成為超級(jí)英雄、探險(xiǎn)家，創(chuàng)造自己的獨(dú)特宇宙。游戲世界無限廣闊，而成為一名游戲開發(fā)者就像是成為了這個(gè)神奇世界的創(chuàng)造者之一。

不過，對(duì)于編程的初學(xué)者和從業(yè)者來說，選擇適合自己的編程語言可能是一項(xiàng)挑戰(zhàn)。市場(chǎng)上有很多種編程語言，每一種都有自己的優(yōu)缺點(diǎn)，那么你應(yīng)該如何選擇適合游戲開發(fā)的編程語言呢？

其實(shí)，這沒有一個(gè)絕對(duì)的答案，因?yàn)椴煌挠螒蚱脚_(tái)和類型可能需要不同的編程語言。但是，小獅妹可以根據(jù)一些常見的游戲平臺(tái)，給大家一些參考的建議。

游戲平臺(tái)決定編程語言的選擇

首先要考慮的是游戲?qū)⒃谀膫€(gè)平臺(tái)上運(yùn)行。一般來說，游戲平臺(tái)可以分為以下三類：

PC端或主機(jī)端

如果你想開發(fā)PC端或主機(jī)端的游戲，那么你最好學(xué)習(xí)C#或C++這兩種編程語言。這是因?yàn)椋?/span>

C#和C++都是高性能的編程語言，可以充分利用硬件資源，提高游戲的運(yùn)行速度和畫面質(zhì)量。

C#和C++都支持面向?qū)ο蟮木幊谭妒剑梢宰屇愀玫亟M織和管理游戲的代碼結(jié)構(gòu)，提高代碼的可讀性和可維護(hù)性。

C#和C++都有很多成熟的游戲引擎和庫，可以讓你快速地開發(fā)出各種類型和風(fēng)格的游戲。例如，Unity、Unreal Engine、Cocos2d-x等。

C#和C++都有很多參考資料和社區(qū)支持，可以讓你在遇到問題時(shí)找到解決方案。

移動(dòng)端Android平臺(tái)

如果你想開發(fā)移動(dòng)端Android平臺(tái)的游戲，那么你最好學(xué)習(xí)Java這種編程語言。這是因?yàn)椋?/span>

Java是Android平臺(tái)的官方開發(fā)語言，可以直接使用Android SDK進(jìn)行游戲開發(fā)，無需額外安裝其他工具或環(huán)境。

Java是一種跨平臺(tái)的編程語言，可以讓你的游戲在不同的設(shè)備上運(yùn)行，無需修改代碼或重新編譯。

Java是一種易學(xué)易用的編程語言，它有著簡(jiǎn)潔明了的語法和豐富的內(nèi)置類庫，可以讓你快速地掌握基本的編程概念和技巧。

Java也有很多優(yōu)秀的游戲引擎和庫，可以讓你輕松地開發(fā)出精彩的游戲。例如，LibGDX、AndEngine、Corona SDK等。

移動(dòng)端IOS平臺(tái)

如果你想開發(fā)移動(dòng)端IOS平臺(tái)的游戲，那么你最好學(xué)習(xí)Objective-C這種編程語言。這是因?yàn)椋?/span>

Objective-C是IOS平臺(tái)的原生開發(fā)語言，可以直接使用Xcode進(jìn)行游戲開發(fā)，享受蘋果公司提供的優(yōu)質(zhì)服務(wù)和資源。

Objective-C是一種基于C語言擴(kuò)展的編程語言，它兼容C語言的所有特性，并增加了面向?qū)ο蠛蛣?dòng)態(tài)特性，可以讓你更靈活地設(shè)計(jì)和實(shí)現(xiàn)游戲功能。

Objective-C也有很多專業(yè)的游戲引擎和庫，可以讓你打造出高品質(zhì)的游戲。例如，SpriteKit、Cocos2d-iphone、Unity等。

額外的編程語言

除了上述主要語言之外，游戲開發(fā)人員可能還需要學(xué)習(xí)其他編程語言，以勝任各種工作任務(wù)。

例如：

Lua：一種輕量級(jí)的腳本語言，可以用來編寫游戲的邏輯和交互，或者作為游戲引擎的擴(kuò)展語言。它有著簡(jiǎn)單的語法和高效的性能，可以讓你快速地實(shí)現(xiàn)游戲功能。很多游戲引擎都支持Lua語言，例如，Cocos2d-x、Corona SDK、Love2D等。

JavaScript：一種廣泛應(yīng)用于網(wǎng)頁開發(fā)的腳本語言，可以用來開發(fā)基于HTML5的網(wǎng)頁游戲，或者作為游戲引擎的擴(kuò)展語言。它有著靈活的語法和強(qiáng)大的功能，可以讓你創(chuàng)建出豐富多彩的游戲效果。很多游戲引擎都支持JavaScript語言，例如，Phaser、Pixi.js、Three.js等。

HTML5：一種用于描述網(wǎng)頁結(jié)構(gòu)和內(nèi)容的標(biāo)記語言，可以用來開發(fā)跨平臺(tái)的網(wǎng)頁游戲，或者作為游戲引擎的基礎(chǔ)技術(shù)。它有著簡(jiǎn)潔明了的標(biāo)簽和屬性，可以讓你方便地布局和顯示游戲元素。很多游戲引擎都基于HTML5技術(shù)，例如，Phaser、Pixi.js、Egret Engine等。

Python：一種優(yōu)雅易讀的編程語言，可以用來開發(fā)各種類型的應(yīng)用程序，包括游戲。它有著豐富的內(nèi)置類庫和第三方模塊，可以讓你輕松地實(shí)現(xiàn)各種功能。它也有一些專門用于游戲開發(fā)的庫，例如，Pygame、Pyglet、Panda3D等。

編程語言的選擇

編程語言的選擇取決于你的目標(biāo)和水平，你需要根據(jù)自己的情況來做出合理的決定。一般來說，編程語言的選擇可以分為以下兩種情況：

如果你是一個(gè)初學(xué)者，想要通過學(xué)習(xí)盡可能少的編程語言來從事游戲開發(fā)，那么我建議你選擇C++和Java。這兩種編程語言都是非常通用和強(qiáng)大的編程語言，可以涵蓋大部分的游戲開發(fā)需求，而且學(xué)習(xí)資源也很豐富。你可以通過學(xué)習(xí)C++來開發(fā)PC端或主機(jī)端的游戲，也可以通過學(xué)習(xí)Java來開發(fā)移動(dòng)端Android平臺(tái)的游戲。而且，這兩種編程語言都跟Objective-C比較相似，都是在C語言基礎(chǔ)上發(fā)展來的，所以你學(xué)習(xí)C++之后可以在短時(shí)間內(nèi)掌握Objective-C，從而也可以開發(fā)移動(dòng)端IOS平臺(tái)的游戲。

如果你是一個(gè)從業(yè)者，想要提高自己的技能和水平，那么我建議你學(xué)習(xí)多種編程語言，并根據(jù)不同的任務(wù)和需求來選擇合適的編程語言。因?yàn)橛螒蜷_發(fā)是一個(gè)需要不斷學(xué)習(xí)和更新的領(lǐng)域，因?yàn)橛螒蚣夹g(shù)和市場(chǎng)都在快速變化，所以你需要掌握多種編程語言和工具，以及適應(yīng)不同的游戲風(fēng)格和類型。你可以通過學(xué)習(xí)Lua、JavaScript、HTML5、Python等編程語言來增加自己的靈活性和創(chuàng)造性，也可以通過學(xué)習(xí)C#、Objective-C等編程語言來增加自己的專業(yè)性和效率。

結(jié)語

總之，游戲開發(fā)需要用到不同的編程語言，而且沒有一種編程語言是萬能的。選擇適合自己情況和職業(yè)發(fā)展的編程語言對(duì)于游戲開發(fā)至關(guān)重要。你需要根據(jù)自己的目標(biāo)和水平來選擇合適的編程語言，只有這樣，你才能做出好玩的游戲。

最近上班無聊時(shí)有事沒事喜歡下幾把象棋，當(dāng)然前提是我項(xiàng)目都做得很好了，空閑時(shí)間才娛樂下，大家不要學(xué)我喲，玩了幾把才知道，自己有好多年沒練過了，游戲中的高手還是挺多的，畢竟這年代，還能在網(wǎng)上安靜的下象棋的也只有老粉絲了，今天這個(gè)中國(guó)象棋的案例，大家可以自己練習(xí)下。

這里還是要推薦下我自己建的前端學(xué)習(xí)群：204436223，不說其他的，能進(jìn)我群的沒兩把刷子怎么可以呢是吧，當(dāng)然小白我也非常歡迎，都是從零開始的嘛，多虛心問問題就行了，不定期分享干貨。想學(xué)到東西的都可以來，歡迎初學(xué)和進(jìn)階中的小伙伴。

效果圖如下：

javascript代碼如下：

文檔版代碼請(qǐng)看文章第二條建議

有很多人或許會(huì)說，我javascript都學(xué)完了，但是自己做案例還是不會(huì)，這就和數(shù)學(xué)公式一樣，公式你都能倒背如流了，但是呢？你知道什么時(shí)候可以用到題里去嗎？你知道這個(gè)題要用哪個(gè)公式嗎？今天一位伙伴還對(duì)我說了這個(gè)問題，我反問，你有自己的項(xiàng)目嗎？‘沒有’。。。。

案例到現(xiàn)在就寫完了，當(dāng)然你如果沒有做過類似案例的做起這個(gè)來還是很麻煩的，自己要記住思路一定不要亂，也不要完全復(fù)制我的代碼，看了一邊代碼，自己徒手能寫出來才是王道。

最后給大家?guī)讉€(gè)建議。

剛學(xué)javascript的話千萬不要急著看一些復(fù)雜的javascript網(wǎng)頁特效的代碼，這樣只會(huì)打擊你的信心和學(xué)習(xí)的興趣
網(wǎng)上看到的什么十天精通javascript的，笑一下就行！
這個(gè)案例就算做完了，想要完整代碼自己練習(xí)的小伙伴進(jìn)我的群自助領(lǐng)取，我已經(jīng)上傳到群文件里了，群號(hào)：204436223，歡迎學(xué)習(xí)交流的小伙伴過來一起學(xué)習(xí)交流。

如果想看到更加系統(tǒng)的文章和學(xué)習(xí)方法經(jīng)驗(yàn)可以關(guān)注我的微信公眾號(hào)：‘web前端課程’關(guān)注后回復(fù)‘給我資料’可以領(lǐng)取一套完整的學(xué)習(xí)視頻

在線咨詢

上一篇：HTML｜CSS控制表格和列表自動(dòng)隱藏超出內(nèi)容
下一篇：SpringMVC 05: SpringMVC中攜帶數(shù)據(jù)的頁面跳轉(zhuǎn)

您的項(xiàng)目需求

*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。

整合營(yíng)銷服務(wù)商