In my experience with javascript performance wasn't an issue. I made a simple 2D tile based puzzle game. (
link) When I implemented the collision detection for it I initially did an O(n^2) algorithm for checking collisions against all of the objects in the scene and would come up with a faster method if needed. I ended up not needing it. The bottleneck in the game for me was drawing the graphics. I even tried to optimize it by having all of the tiles draw once onto an off-screen context and simply copy over that large image once every frame to reduce the amount of drawing calls but it didn't really change the speed much. It seemed that copying over pixels is what took the most time, but in the end The game still ran fine. I also used a port of box2d for an editor in a physics based game I worked on and it worked surprisingly well. (
link) Basically what I am trying to say is don't worry about your game running too slow. Just program your game in a way that makes sense and focus on making your code beautiful. That brings me to the next thing I want to take about. Classes.
Javascript does not have classes built into the language, but you have prototypes and that lets you create classes yourself. Read up on javascript prototypes. Make sure you understand what they do and how they work. I will write out the basics here.
To create a 'class' you actually define a function.
function Foo(bar)
{
this.bar = bar;
}
Then to create an instance of a class you use the 'new' operator on the function
var foo = new Foo("string");
to add methods to the class you add functions to the prototype of a function
Foo.prototype.getBar() = function() {
return this.bar;
}
Then you can call them on any instance of the class
alert(foo.getBar());
One thing that is great about javascript is it has closures. When I started using javascript I didn't use them much, the more familiar I get with javascript the more I love to use closures. Basically what you need to know is this. Functions can be used as objects in javascript and with closures, any local variables in the same scope where the function was declared can be used in the function. For example
var foo = "string";
var bar = function()
{
// foo can be used in this function,
// even if var is stored and called
// later after foo is out of scope
console.log(foo);
}
bar();
Any changes to variables in a closure are not reflected outside the closure (except for global variables) For example
{
var foo = "original string";
var bar = function() {
// this only changes foo in this closure
foo = "new value";
}
bar();
// this will display "original string"
console.log(foo);
}
My advice to you is to get familiar with closures. They are great and, if used well, can make your code beautiful. One thing to remember is that the local variable 'this' does not go into closures. If you need to pass 'this' in you need to create a temporary local variable. For example.
{
this.message = "this is foo";
bar = {};
bar.message = "this is bar";
var foo = this;
bar.functionCall = function() {
console.log(this.message); // this will print "this is bar"
console.log(foo.message); // this will print "this is foo"
}
bar.functionCall();
}
What is happening here is 'this' is the object that the function is stored in when it is called.
Anyway, Those are a few things I think are good to know when starting javascript. I hope it is useful to you.
