What is Cocos2d-JS?

Question

Cocos2d-JS is Cocos2d-x engine's JavaScript version that includes Cocos2d-html5 and Cocos2d-x JavaScript Bindings. It equips your game with cross-browser and cross-platform abilities, accompanied by full Cocos2d-x features and simplified JavaScript friendly APIs.

I understand that you write JS and it works every where, but how it is done? I want to understand this diagram: http://www.cocos2d-x.org/wiki/Getting_Started_Cocos2d-js As I understand cocos2d-html5 is the same thing as cocos2d-x but it is in JS and based on WebGL. If this is true then what is Cocos2d-JSB? Does it compile JS script to native code? Or is it a JS extended interpreter, that understands more than native interpreter and can interpret cocos2d specific commands?

Answer 1

Cocos2d-x uses SpiderMonkey, the Firefox JS virtual machine (VM), to execute JS code.

The JS VM is extended to support all the cocos2d, Chipmunk and CocosBuilder Reader APIs. So, when you create a CCSprite in JS, you are actually creating an C++ CCSprite. When you create an action in JS, you are actually creating an C++ action, when you create a particle system in JS, you are actually creating an C++ particle system… and so on. This approach is about 10x ~ 20x faster than HTML5 games even when they use accelerators like directCanvas Basically all the cocos2d, Chipmunk or CocosBuilder Reader APIs are going to perform almost at native speed. But you should pay attention to the following scenarios: The performance could be slow down while the garbage collector is run. Workaround: Do not create many JS objects. Reuse as many as possible Having a complex main loop could slow down the performance. Workaround: Profile your JS code, and if you can’t further optimize it, write the expensive parts in C++ and create JS bindings for those functions.

This is from wiki. So the JS interpreter is extended to understand cocos2d api command such as create Action or create Sprite.

Answer 2

As I understand cocos2d-html5 is the same thing as cocos2d-x but it is in JS and based on WebGL. If this is true then what is Cocos2d-JSB?

I believe the JSB appended to cocos2d-x JSB simply means: cocos2d-x JavaScript Bindings

The module that does the translation / mediation between two programming languages is commonly called a "binding". The JSB is just a small aspect of cocos2d-x that allows users to run apps written in cocos2d-js Javascript via the cocos2d-x C++ rendering engine.

Note that cocos2d-html5 is not exactly the same as cocos2d-x. It provides similar functionality than cocos2d-x but runs only in a web browser. Obviously cocos2d-html5 has no functionality for touch or accelerometer input, and other restrictions when it comes to saving and loading files, for instance.

Does it compile JS script to native code? Or is it a JS extended interpreter, that understands more than native interpreter and can interpret cocos2d specific commands?

The JSB simply maps between the Javascript API and the C++ cocos2d-x versions of classes, methods, identifiers and what not.

I don't know whether it compiles Javascript to native code.

The gist of this:

cocos2d-js provides a programming interface (API) in Javascript that produces the same results whether you run it in the browser via cocos2d-html5 or on other (mobile) platforms via cocos2d-x.