Apa perpustakaan JS yang bagus untuk pengembang game? [Tutup]


56

Jika saya memutuskan untuk menulis permainan sederhana baik teks maupun grafik (2d) perpustakaan apa yang akan saya gunakan? (Asumsikan kita menggunakan browser yang kompatibel dengan HTML5)

Hal-hal utama yang dapat saya pikirkan

  • Rendering teks di layar
  • Animasi sprite (menggunakan gambar / css)
  • Input (menangkap tombol panah dan mendapatkan posisi mouse relatif)
  • Mungkin beberapa sumber daya preloading atau memuat sumber daya secara dinamis dan memilih pesanan
  • Terdengar (tapi saya tidak yakin betapa pentingnya hal ini bagi saya pada awalnya). Mungkin dengan mencampur dan merantai suara atau memutar selamanya sampai berhenti.
  • Jaringan (prioritas rendah) untuk menghubungkan pengguna ke yang lain atau untuk secara terus-menerus MENDAPATKAN data tanpa banyak permintaan (Saya tahu ini ada tetapi saya tidak tahu betapa mudahnya mengatur atau menggunakan. Tetapi ini tidak penting bagi saya. pertanyaan).

3
Daftar yang cukup lengkap pertandingan HTML5 libs github.com/bebraw/jswiki/wiki/Game-Engines
oberhamsi

Apa? Anda dapat melakukan semua itu hanya dengan JavaScript murni. Socket.io untuk jaringan.
jcora

Anda mungkin menemukan Stage.js menarik (saya penulisnya).
Ali Shakiba

Jawaban:


25

jQuery dan MooTools adalah pustaka JavaScript yang luar biasa; Saya lebih suka jQuery sendiri. Salah satu dari mereka akan membantu Anda dalam pengembangan game JS Anda jika Anda menggunakan DOM. Jika Anda menggunakan rendering Canvas, saya masih berpikir Anda harus menggunakan salah satu pustaka tersebut, tetapi Anda harus mempelajari fungsi Canvas. Berikut ini adalah tutorial yang memperkenalkan Anda pada kanvas dengan membuat klon Breakout, jadi itu mungkin jenis yang Anda cari (dan menggunakan jQuery).

Animasi sprite adalah masalah mengubah src gambar, atau preloading beberapa gambar dan menukar mereka, atau di kanvas hanya menggambar bingkai dari animasi. Perpustakaan di atas dapat membantu dengan semua kasus ini. Perpustakaan juga membantu dengan masukan (lihat peristiwa seperti onkeypress dan onmousemove).

Untuk sumber daya prapemesanan, saya sepertinya beberapa game yang menggunakan gambar "sprite sheet" tunggal ( ini adalah game Pacman Google ). Saya percaya mereka pada dasarnya membuat DIV dari satu ukuran ubin, dengan properti latar belakang-gambar CSS diatur ke lembar sprite dan properti posisi latar belakang diatur ke offset ubin pada lembar sprite. Saya belum melihat perpustakaan yang akan melakukan ini untuk Anda, tetapi jQuery atau MooTools dapat membantu Anda sejauh secara dinamis membuat DIV dan memanipulasi CSS-nya. Kalau tidak, preloading gambar adalah masalah membuat <img>tag dari gambar yang Anda ingin dimuat sebelumnya, dan tidak menambahkannya ke halaman (atau menambahkannya tanpa terlihat). Ini sebuah posting blog yang memiliki beberapa kode untuk fungsi menggunakan jQuery untuk memuat gambar untuk Anda.

SoundManager 2 tampaknya menjadi perpustakaan suara JS untuk digunakan; Saya tahu Vanthia menggunakannya, dan Google Pacman menggunakan sesuatu yang serupa (atau setidaknya teknik yang sama, menggunakan file Flash tersembunyi pada halaman untuk memutar suara).

Untuk jaringan, jQuery dapat menangani AJAX untuk Anda, atau jika Anda ingin jaringan yang lebih real-time (dan meminta server untuk melakukannya), lihatlah di soket JavaScript . Saya tidak tahu apakah ada perpustakaan yang stabil di sana untuk itu, tetapi Anda mungkin melihat ini atau ini . Pada dasarnya ia menggunakan file Java atau Flash tersembunyi pada halaman sehingga Anda dapat melakukan komunikasi socket yang benar dengan JavaScript, yang jauh lebih cepat daripada polling AJAX dan sedikit lebih efisien daripada "AJAX Push" . Namun, kemungkinan besar, AJAX Push akan menjadi apa yang Anda inginkan, dan APE (Ajax Push Engine) mungkin adalah perpustakaan yang akan digunakan.

Juga, berikut ini adalah pembicaraan teknologi Google tentang "Membangun Mesin Game Berbasis JavaScript untuk Web" . Terlihat rapi.


2
Jawaban ini agak konservatif; jika dia hanya ingin menggunakan browser HTML5 maka dia dapat menggunakan kanvas dan menggunakan salah satu perpustakaan HTML5 (lihat komentar saya pada pertanyaan). Menggunakan DOM & CSS untuk permainan tampaknya seperti peretasan (meskipun peretasan bisa dilakukan dalam beberapa kasus).
oberhamsi

2
Apa yang membuatnya tampak seperti retasan? Google tidak punya masalah menggunakan DOM & CSS murni dengan logo PacMan mereka dan saya cukup suka permainan pong saya di beranda. Sejujurnya, kanvas tampak seperti retasan, peretasan persegi gambar yang dirender ke dalam halaman yang didominasi oleh DOM. Tapi sayang dengan dorongan ke arah itu dan WebGL jelas browser akan menjadi aplikasi melakukan segalanya yang berat jika belum. Saya ngelantur ...
Ricket

Jika dia ingin menggunakan audio, jaringan, rendering teks, dia harus menggunakan browser siap HTML5. Alas kanvas akan menjadi pilihan yang bagus. Jika Anda tetap menggunakan DOM & CSS Anda terbatas sejauh teknologi ini sudah membuat lapisan presentasi dengan asumsi tertentu (aliran teks, layering, semacam grafik adegan untuk dokumen teks). Sedangkan dengan kanvas Anda dapat memanipulasi piksel dengan cara apa pun yang Anda inginkan, yang lebih dekat dengan 'normal', mesin permainan mentah di atas SDL atau opengl.
oberhamsi

Pustaka audio dan jaringan yang saya sediakan tidak memerlukan HTML5. Dan sebenarnya saya melihat aliran teks, layering, dan grafik adegan sebagai manfaat. Sebagian besar game hanya berupa sprite (gambar) yang diposisikan dan dipindahkan dan tidak memerlukan akses langsung ke piksel. Ini benar-benar perlu dievaluasi berdasarkan game yang ingin Anda buat, dan juga jika Anda secara pribadi lebih nyaman dengan kanvas atau DOM, jika Anda ingin mendukung browser yang lebih lama, jika Anda memerlukan kanvas daya ekstra yang disediakan, dll.
Ricket

1
ya, itu tergantung permainannya. Tapi dia meminta HTML5 dan jawaban Anda kebanyakan tentang Flash dan DOM level 1 :) Jika dia ingin melakukan pengembangan HTML5 tepi berdarah maka jangan memikatnya kembali.
oberhamsi

12

Ketika saya mengevaluasi mesin JavaScript beberapa waktu lalu, favorit saya adalah Licik:

http://craftyjs.com/

Ada beberapa pilihan yang harus saya pertimbangkan, dan beberapa yang saya sukai adalah:

http://easeljs.com/

http://www.limejs.com/

http://code.google.com/p/casualjs/

(Kebetulan, opsi lain yang terlihat cukup apik pada awalnya adalah http://impactjs.com/ tetapi mempertimbangkan biaya uang dan opsi lain yang saya lihat adalah mesin open-source ada beberapa kelalaian mencolok, seperti ketidakmampuan untuk melampirkan elemen tampilan di sebuah heirarki.)


UPDATE: Sudah hampir 2 tahun sejak saya memposting jawaban itu dan situasinya telah sedikit berubah (ini adalah bidang teknologi yang baru lahir.) Meskipun Crafty masih merupakan pilihan yang bagus, pada tahun lalu EaselJS telah mengambil banyak momentum (terutama mempertimbangkan Adobe melompat pada kereta EaselJS .) Saya akan beralih ke alat itu untuk proyek masa depan (juga perhatikan bahwa ia memiliki situs web baru )


apa yang kamu sarankan hari ini? setelah 4 tahun
Pooya Estakhri

1
Yah Pembaruan berasal dari 1,5 tahun yang lalu, dan saya masih menyarankan itu.
jhocking

7

Mesin Effect Games (javascript) luar biasa untuk game berbasis 2d, ubin / sprite. Situs web tidak melakukan pekerjaan yang sangat baik untuk menggambarkan apa yang hebat tentang itu, tetapi segera setelah Anda menggali dokumentasi yang sangat baik Anda akan melihat berapa banyak yang telah ditanggung untuk Anda:

  • menulis
  • deteksi tabrakan
  • pengeditan level
  • manajemen aset
  • audio
  • input dan kontrol
  • pembuatan dan manajemen tileset
  • layering
  • animasi
  • kinerja (mengunci framerate)
  • dukungan dan abstraksi lintas-browser
  • hosting
  • menanamkan
  • Dukungan HUD

Saya benar-benar tidak bisa memberikan daftar lengkap karena fitur yang lengkap. Satu hal yang hilang adalah kemampuan untuk membuat menu dan UI dalam game (mis., Manajer peralatan, dll), tetapi seharusnya ada dalam daftar todo.


4
Sayangnya mesin efek tampaknya benar-benar ditinggalkan.
Letharion

6

Saya memelihara mesin game 2D kanvas yang disebut JawsJS - http://jawsjs.com/

Sumber @ https://github.com/ippa/jaws

catatan tebing:

  • Kode yang dapat dibaca dan didokumentasikan
  • 12+ contoh terdokumentasi yang dibundel
  • Konstruktor yang berguna seperti Sprite (), SpriteSheet () dan Animation ()
  • Status permainan - Pisahkan bagian permainan Anda untuk kode yang lebih terorganisir
  • Aset - Rahang akan melakukan pra-muat semua aset Anda sebelum permainan dimulai
  • Tidak bergantung pada perpustakaan javascript lainnya
  • Dibangun berdasarkan pelajaran yang diperoleh dari bertahun-tahun mengembangkan Chingu, lib game Ruby


4

Saya sendiri telah melakukan riset di bidang ini belakangan ini, jadi izinkan saya chip $ 0,02 saya:

PlayN Adalah pustaka lintas platform dari Google, yang menyusun game berorientasi objek dari Jawa ke javascript / Flash / Android. Ini akan menangani JSON (AJAX), model data, dan memiliki semantik waras untuk pembaruan dan rendering. Hal yang sangat keren.

Pemrosesan Adalah perpustakaan yang mudah digunakan yang ditujukan untuk desainer dan seniman. Ini sangat mudah digunakan dan dapat memberi Anda hasil yang bagus. Saya telah menggunakan versi Java untuk pemodelan ilmiah, dan itu menyenangkan untuk digunakan. Adegan 3D akan membutuhkan WebGL, tetapi adegan 2D berfungsi tanpa.

Three.js Memiliki beberapa demo yang tampak hebat. Ini membutuhkan WebGL, tetapi hasilnya tampaknya sepadan. Ada beberapa contoh online juga.

Berikut adalah beberapa item lain di tautan pribadi saya yang terkait dengan WebGL:





1

Plugin Pixie

Pencipta Contrasaurus telah merilis banyak komponen individual mereka !!!

Mereka memiliki kode untuk melakukan transformasi matriks , abstraksi kanvas dan banyak hal menarik lainnya.

Kode mereka hebat dan pustaka mereka sangat berguna.



1

Aneh bahwa Perpustakaan Penutupan Google belum disebutkan. Ini memiliki API besar, memungkinkan lebih banyak gaya pengkodean berorientasi objek dan memiliki kompiler.

Sejauh ini saya hanya menggunakan kompiler tetapi saya berencana untuk belajar istirahat secepatnya.


1

Saya biasanya menggunakan jawsjs karena sangat mudah untuk mengaturnya dan mulai mengembangkan game dalam hitungan menit. Ini memiliki banyak kelas default yang sangat berguna (Tilemap, Viewport, Sprite, dan lainnya) yang sangat membantu pengembangan game.


1

Sebenarnya Anda punya banyak dari mereka, tetapi yang pertama tergantung pada jenis mesin permainan yang Anda cari. Saya bisa memberi Anda beberapa referensi yang paling penting.

Mesin Game 2D

  • Cocos2D cenderung sedikit lebih modis saat ini. Saya melihat pertanyaan Cocos2D muncul di sana-sini di Stackoverflow baru-baru ini.
  • Imbasnya , Anda bisa melihat benchmark berjalan di situs web resmi.

Mesin Game 3D

Mozilla foundation telah mengerjakan mesin game 3D bernama Paladin . Ini Mozilla, kurasa tidak ada salahnya.


0

Ada juga gameQuery, mesin game berbasis jQuery. Memiliki dokumentasi yang layak tentang API mereka, serta, beberapa API pembungkus suara yang mereka tautkan ke situs mereka.

http://gamequery.onaluf.org/




0

Tom di sini dari Scirra, kami adalah tim 2 orang yang telah membuat Construct 2, pembuat game HTML5 . (Versi gratis tersedia).

Anda mungkin ingin mempertimbangkan mesin seperti kami karena ia melakukan banyak kerja keras untuk Anda. Misalnya untuk melakukan tabrakan dalam kode sendiri bisa sangat sulit (pikirkan tabrakan poligon). Segala sesuatu di daftar Anda mudah dicapai dengan Membangun 2.

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.