Status Perpustakaan Canvas Javascript Saat Ini? [Tutup]

Saya telah melakukan penelitian tentang perpustakaan kanvas HTML dan saya menemukan pertanyaan ini. Apa keadaan seni saat ini di pustaka dan kerangka kerja JavaScript kanvas HTML? yang ditanyakan pada tahun 2010. Jawaban teratas adalah Fabric.js. Setelah melakukan sedikit lebih banyak penelitian, saya menemukan http://www.html5canvastutorials.com/ yang menampilkan tutorial tentang KineticJs, yang membanggakan memiliki beberapa kanvas untuk kecepatan. Sedikit lebih banyak penelitian kemudian mengungkapkan bahwa perpustakaan Canvas tampaknya ada di mana-mana dalam hal kecepatan dan fitur. Bagaimana kondisi library dan framework JavaScript Canvas saat ini? Apakah ada yang keluar di atas?

EDIT: Karena perpustakaan selalu berubah dan banyak orang baru-baru ini datang ke sini untuk berita dan info tentang perpustakaan baru, saya mengubah pertanyaan menjadi lebih abadi.

Penafian: Saya adalah penulis dari Fabric.js .

Saya akan mengatakan bahwa Easel.js, Fabric.js, dan Paper.js adalah yang paling banyak digunakan saat ini. Saya menilai dari jumlah pengamat Github untuk setiap repositori, volume diskusi di Grup Google mereka, dan seberapa sering saya mendengar tentang mereka digunakan sebagai perpustakaan kanvas di Twitter.

Ini juga yang memiliki dokumentasi, contoh / demo, grup diskusi, dan pengujian unit yang kurang lebih layak (status pengujian di sebagian besar pustaka kanvas lainnya cukup menyedihkan).

Saya juga mempertahankan tabel perbandingan dari berbagai pustaka kanvas ini , di mana Anda dapat melihat seberapa baru pustaka tersebut diperbarui, ukurannya, dukungan untuk IE <9 atau node.js, dan banyak lagi.

EDIT: KineticJS tidak lagi aktif dipertahankan.

Penafian: Saya membuat KineticJS

KineticJS sebenarnya bekerja dengan cukup baik. Anda dapat menemukan kode sumber di Github , yang saat ini dibintangi oleh 2180 orang.

Ini dapat menangani ribuan bentuk bersamaan:

10.000 uji stres seret dan lepas: http://www.html5canvastutorials.com/labs/html5-canvas-kineticjs-drag-and-drop-stress-test-with-1000-shapes/

10.000 bentuk dengan keterangan alat: http://www.html5canvastutorials.com/labs/html5-canvas-10000-shape-stress-test-with-kineticjs/

Ini memiliki dukungan acara yang sangat baik, termasuk acara seluler, dan memiliki rangkaian pengujian unit 100-an yang cukup solid sehingga basis kode terasa cukup solid.

kangax: PS kerja luar biasa dengan fabric.js! Selain KineticJS (tentu saja), dua perpustakaan favorit saya yang lain adalah kain dan kertas.

Untuk pembaca terkini, per Jan 2013, saya mengevaluasi:

• Kinetis
• Kain
• Kertas
• Kuda-kuda

Dengan "dievaluasi", saya melakukan lebih dari sekadar membaca dokumen; Saya membuat aplikasi prototipe.

Saya mulai dengan Fabric karena sepertinya memiliki komunitas terbesar dan berpikir bahwa itu akan menjadi solusi saya. Tapi, saya menyerah pada Fabric karena alasan berikut:

• inkonsistensi API yang aneh dan tidak berdokumen yang menghabiskan banyak waktu saya secara tidak perlu.
• dukungan acara penunjuk tidak konsisten. Secara khusus, Fabric tidak menganggap "Path" sebagai objek bentuk asli yang dapat dipilih dan diamati. Ini tidak memenuhi kebutuhan saya karena Jalur interaktif merupakan persyaratan utama aplikasi saya.
• di balik layar penambahan terjemahan ke Canvas untuk memposisikan objek. Bagi saya, Fabric mencoba menjadi terlalu pintar dalam hal ini tanpa menjelaskan kepada pengembang apa yang dilakukannya.
• pendapat yang terlalu kuat tentang cara kerja interaktivitas memindahkan, mengubah ukuran, dan memutar. Dalam banyak hal, sangat bagus untuk memiliki fungsionalitas ini dibangun ke dalam kerangka kerja tetapi, dalam kasus saya, saya tidak setuju dengan cara penerapannya yang pada dasarnya berarti harus menerapkan ulang sendiri.
• dokumentasi renggang - lot dari kasus-kasus di mana dokumentasi suatu metode dalam bentuk: "setX (Y) - set X ke Y" :-)

Saya melihat Paper dan tidak terlalu jauh. Tampaknya terlalu tumpul bagi saya dan juga termasuk di antara terlalu banyak bangku IMO - itu terlalu banyak perpustakaan visualisasi untuk menjadi model objek sederhana untuk Canvas tetapi itu tidak cukup perpustakaan visualisasi untuk bersaing dengan D3. Plus, dokumentasinya lagi-lagi tidak bisa diakses secara khusus.

Saya pikir Easel mungkin sangat masuk akal jika Anda memiliki latar belakang Flash / ActionScript tetapi saya tidak. Plus, tampaknya terlalu berfokus pada permainan untuk kebutuhan saya. Paku di peti mati lagi-lagi dokumentasi - tidak cukup dan disajikan dalam format non-standar.

Jadi, saya akhirnya memilih Kinetic karena:

• tutorial dan contoh yang sangat kaya dan jelas
• Fungsi API melakukan apa yang mereka sebut dan sebagian besar dapat ditebak - produktivitas yang lebih cepat, kurva pembelajaran yang lebih dangkal
• cukup jelas tentang apa yang dilakukannya dan apa yang tidak - tidak sekaya beberapa yang lain tetapi itu adalah keuntungan; ia melakukan lebih sedikit hal tetapi melakukannya dengan lebih baik
• Paths adalah Bentuk warga kelas satu, seperti Bentuk lainnya, yang penting untuk kebutuhan saya.

Kinetic tidak sempurna dengan cara apa pun dan ada beberapa kali ketika saya harus mendalami kode sumber untuk mengetahui apa yang sebenarnya terjadi di balik penutup. Plus, saya merindukan parsing SVG dan keluaran Fabric.

Saya akan sangat merekomendasikan pixijs. Ini adalah pustaka kanvas berkinerja tinggi.

Pixi.js adalah perender webGL 2D dengan penggantian kanvas tanpa batas yang memungkinkannya bekerja di semua browser modern baik desktop maupun seluler.

http://www.goodboydigital.com/pixi-js-is-out/