Konva – HTML5 2d canvas library for desktop and mobile applications

We are using Konva for simple education games and the game editor at <a href="https:&#x2F;&#x2F;learnplayground.com" rel="nofollow">https:&#x2F;&#x2F;learnplayground.com</a> and are mostly happy with it. It is easy to work with, the documentation is good, and so far supports all our use cases. The only drawback is some performance issues with animations on some browsers which we are not sure if we can fix by optimizing our code.<p>We have been using Konva for 2 years and would probably have chosen it again if we where going to start developing today

Been using this for a new project for a few months [0]. Cannot speak highly enough about it - Thank you Anton [1]!<p>[0] specifically the react package <a href="https:&#x2F;&#x2F;github.com&#x2F;lavrton&#x2F;react-konva" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;lavrton&#x2F;react-konva</a><p>[1] <a href="https:&#x2F;&#x2F;lavrton.com&#x2F;" rel="nofollow">https:&#x2F;&#x2F;lavrton.com&#x2F;</a>

I have used Phaser to make games using HTML5 + TypeScript. It was my first attempt of doing a browser game and I found it pretty decent to use.<p><a href="https:&#x2F;&#x2F;phaser.io" rel="nofollow">https:&#x2F;&#x2F;phaser.io</a><p>I don&#x27;t have the final build of the project I made with it publicly visible, but an older build:<p><a href="https:&#x2F;&#x2F;total-tetris.herokuapp.com" rel="nofollow">https:&#x2F;&#x2F;total-tetris.herokuapp.com</a><p>Supports mobile (touch controls) and desktop (keyboard controls). Final version has Facebook leaderboards.<p>I had one or two issues with Phaser which I supplied fixes for which were merged.<p>If I made a similar project, I would check out latest alternatives but wouldn&#x27;t hesitate to use Phaser again.

It&#x27;s worth mentioning that Konva began as a fork of KineticJS:<p><a href="https:&#x2F;&#x2F;github.com&#x2F;ericdrowell&#x2F;KineticJS&#x2F;issues&#x2F;1061" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;ericdrowell&#x2F;KineticJS&#x2F;issues&#x2F;1061</a>

I&#x27;m curious: How does this compare to something like Pixi?

Cool! This is a superset of some things people misuse Literally Canvas[1] for. I look forward to pointing people toward it when they ask about these kinds of features.<p>[1]<a href="http:&#x2F;&#x2F;literallycanvas.com" rel="nofollow">http:&#x2F;&#x2F;literallycanvas.com</a>

I like the fact that there are plenty of demos!

This library is great, it&#x27;s the basis of a mapping app (think D&amp;D) some friends and I kickstarted[0] a while back.<p>I also posted some optimizations techniques[1] for this library to Stack Overflow.<p>[0] <a href="http:&#x2F;&#x2F;coneofnegativeenergy.com&#x2F;hexkit&#x2F;" rel="nofollow">http:&#x2F;&#x2F;coneofnegativeenergy.com&#x2F;hexkit&#x2F;</a><p>[1] <a href="https:&#x2F;&#x2F;stackoverflow.com&#x2F;questions&#x2F;42729872&#x2F;optimizing-konva-js-for-many-images&#x2F;42787941#42787941" rel="nofollow">https:&#x2F;&#x2F;stackoverflow.com&#x2F;questions&#x2F;42729872&#x2F;optimizing-konv...</a>

Really great, thanks for the resource!<p>I&#x27;ve had ideas in the past for websites or projects where I would have wanted to use HTML5s canvas, but I haven&#x27;t ever known where or how to get started. The demo here seemed very straightforward and easy to understand.<p>EDIT: Upon further consideration, this will actually be perfect for an upcoming project that I&#x27;ve been neglecting for a while due to not knowing how to do the drawing aspect. And it works with React ️

Anyone able to compare this with <a href="http:&#x2F;&#x2F;paperjs.org&#x2F;" rel="nofollow">http:&#x2F;&#x2F;paperjs.org&#x2F;</a>? In the past I&#x27;ve used Paper.js and have been very happy with it. It looks like Konva has a very similar set of features.

I have used Konva to make a 2D map engine in my last job. It was a good dev experience.

This is pretty neat, does anyone have any other similar or equivalent libraries to compare this against? It&#x27;s always nice to see comparisons to gauge the value of a feature or system structure. Thanks!

Can anybody explain this: &quot;High performance event detection via color map hashing&quot;? Any resources that explain this concept?

Wondering if Konva could be used for UI rendering (imagine flutter&#x2F;Skia for web). And if it could be faster then DOM.

The demo on the front page says &quot;Try to drag a star&quot;, but when I do, nothing happens.

Nitpicking: The stars don&#x27;t do anything when I click them. Only when I start to drag them do I get any kind of visual feedback that something happened (they scale up)<p>Not sure if that&#x27;s intentional. I&#x27;m on Firefox.

Can this be packaged as a single exe and can you make calls outside to like the file system or network?