Showing posts with tag: tutorial 
Posted May 17, 2011 by Nick Vogt in Programming
JSON stands for JavaScript Object Notation. It is a widely-used model for transferring variable data as text, and is often used in combination with AJAX to create the basis for highly-interactive, portable, and modular websites (Facebook, Twitter, etc).
If you are familiar with JavaScript objects, then you already know JSON! If you aren't, it is very easy to learn. A JavaScript object is just like an object in ActionScript 3 or an associative array in PHP, just with slightly different syntax.
Here is the basic syntax for JSON. This object contains two strings, an array, and an object:
Continue reading...
If you are familiar with JavaScript objects, then you already know JSON! If you aren't, it is very easy to learn. A JavaScript object is just like an object in ActionScript 3 or an associative array in PHP, just with slightly different syntax.
Here is the basic syntax for JSON. This object contains two strings, an array, and an object:
{
"one": "A Number",
"hello": "world",
"myarray": [
"orange",
"apple",
"banana"
],
"myobject": {
"library": "books",
"bar": "alcohol"
}
}
"one": "A Number",
"hello": "world",
"myarray": [
"orange",
"apple",
"banana"
],
"myobject": {
"library": "books",
"bar": "alcohol"
}
}
Continue reading...
Posted May 12, 2011 by Nick Vogt in Programming
In a nutshell, AJAX allows you to update parts of a page with server-side content using JavaScript, without reloading the whole page. AJAX is not a new language, it's just a method for using JavaScript to achieve this functionality.
To use AJAX you will need to know a bit of JavaScript and (for this example) PHP, and have a server that can parse PHP. If you don't have this, you can download Apache server and PHP for free from their respective websites (follow my guide on setting up Apache, MySQL, and PHP on Windows).
Before diving into AJAX, first take a look at this example:
Continue reading...
To use AJAX you will need to know a bit of JavaScript and (for this example) PHP, and have a server that can parse PHP. If you don't have this, you can download Apache server and PHP for free from their respective websites (follow my guide on setting up Apache, MySQL, and PHP on Windows).
Before diving into AJAX, first take a look at this example:
<html>
<head>
<script type="text/javascript">
function hello()
{
document.getElementById('content').innerHTML = 'Hello World!';
}
</script>
</head>
<body>
<input type="button" value="Click Me" onclick="hello();">
<div id="content">Nothing here yet.</div>
</body>
</html>
<head>
<script type="text/javascript">
function hello()
{
document.getElementById('content').innerHTML = 'Hello World!';
}
</script>
</head>
<body>
<input type="button" value="Click Me" onclick="hello();">
<div id="content">Nothing here yet.</div>
</body>
</html>
Continue reading...
Posted March 10, 2011 by Nick Vogt in Programming
Most Flash Actionscript 3 developers start out by writing code directly into the Actions window (F9), or into a separate .as file and using include to include that code into the Actions window. This works fine for quick, simple programs, but to get the most out of Flash and Actionscript 3, you should learn how to use Packages and Classes.
Programming using classes can be a little odd at first. Don't think of your program as one single block of code that performs a series of actions based on user input. Instead, think of your program as comprised of many separate, interacting objects, that each have their own tasks and can interact with each other.
Continue reading...
Programming using classes can be a little odd at first. Don't think of your program as one single block of code that performs a series of actions based on user input. Instead, think of your program as comprised of many separate, interacting objects, that each have their own tasks and can interact with each other.
Continue reading...
Posted January 17, 2011 by Nick Vogt in Programming
Passing variables to a Flash movie that is embedded in a web page can be done using either the query string or FlashVars. The difference between these methods is that using query string will cause browsers to re-download the Flash movie each visit, while FlashVars allows browsers to use the cached version. Depending on the functionality you want, one method may suit you better than the other.Here is an example of loading variables via FlashVars (use an & to separate each name/value pair):
<object>
<param name="movie" value="movie.swf">
<param name="FlashVars" value="name1=value1&name2=value2">
<embed src="movie.swf" FlashVars="name1=value1&name2=value2">
</object>
<param name="movie" value="movie.swf">
<param name="FlashVars" value="name1=value1&name2=value2">
<embed src="movie.swf" FlashVars="name1=value1&name2=value2">
</object>
And now via the query string:
Continue reading...
Posted November 19, 2010 by Nick Vogt in Programming
In order to use int typecasting in place of Math.floor or Math.ceil, you must first understand exactly what these functions do: Math.floor takes a number and returns the next lowest whole integer. Passing 0.9 will return 0 and -0.9 will return -1. Math.ceil returns the next highest integer, so will return 1 from 0.9 and 0 from -0.9. This is different than truncating, which would return 0 in all cases, and is why typecasting using int (usually used to truncate) wouldn't seem to work at first.
In order to make int typecasting work, you need to add a condition check to see if the number is negative or positive (negative for floor, positive for ceil), and adjust it by 1 if it is. Why do this instead of just using Math.floor or Math.ceil? Because it is faster and you can avoid a function call if desired. Look at these examples:
Using Math.floor like normal requires 691 milliseconds for this run:
Now using a custom floor function:
Continue reading...
In order to make int typecasting work, you need to add a condition check to see if the number is negative or positive (negative for floor, positive for ceil), and adjust it by 1 if it is. Why do this instead of just using Math.floor or Math.ceil? Because it is faster and you can avoid a function call if desired. Look at these examples:
Using Math.floor like normal requires 691 milliseconds for this run:
var i:int = 0;
var testVar:Number = -82.20035;
var floored:Number;
var time1 = new Date();
for(i = 0; i < 5000000; i ++)
{
floored = Math.floor(testVar);
}
var time2 = new Date();
trace(time2 - time1);
var testVar:Number = -82.20035;
var floored:Number;
var time1 = new Date();
for(i = 0; i < 5000000; i ++)
{
floored = Math.floor(testVar);
}
var time2 = new Date();
trace(time2 - time1);
Now using a custom floor function:
Continue reading...
Posted November 17, 2010 by Nick Vogt in Programming
See this post for a much-improved version
----------------------------
I am working on a simple platformer in Actionscript 3. The player aims with the mouse cursor and when he shoots it calculates the vector using trigonometry and a speed multiplier. This works well as it is very accurate, but I started to wonder if I might not be able to make a more efficient formula, since it doesn't really need to be absolutely accurate.
Here is the trigonometry I used originally (the syntax is Actionscript 3 but it should be pretty self-explanatory for C++, Python, etc programmers):
I am looking to use something that doesn't use any trigonometry functions, just multiplication and division. I came up with this:
Continue reading...
----------------------------
I am working on a simple platformer in Actionscript 3. The player aims with the mouse cursor and when he shoots it calculates the vector using trigonometry and a speed multiplier. This works well as it is very accurate, but I started to wonder if I might not be able to make a more efficient formula, since it doesn't really need to be absolutely accurate.
Here is the trigonometry I used originally (the syntax is Actionscript 3 but it should be pretty self-explanatory for C++, Python, etc programmers):
radians = Math.atan2(eX - sX, eY - sY);
vX = Math.sin(radians) * speed;
vY = Math.cos(radians) * speed;
vX = Math.sin(radians) * speed;
vY = Math.cos(radians) * speed;
I am looking to use something that doesn't use any trigonometry functions, just multiplication and division. I came up with this:
Continue reading...
Posted November 17, 2010 by Nick Vogt in Programming
Before doing more complex collision detection in a game, it is useful to first check and make sure a larger bounding area is colliding. This is so that only one calculation needs to be done for each collision detection most of the time, and then further collision detections are only done if objects are close and potentially colliding.
The higher-level bounding collision detection is often done with either a bounding box or a bounding circle (for 2D). The question is, which is faster? With bounding boxes you are checking all four sides of the boxes to see if they overlap. With bounding circles you are checking the distance between two circles and comparing it to their combined radiuses (radii).
Update:
Following a comment from "C coder" below, I found that my previous method for checking bounding box collision was not optimized. Previously I had checked all 4 sides in one "if statement". After further testing, it turns out that checking each side individually is faster. This is because if the first bounding box's right side is less than the other bounding box's left side, there can be no collision and there's no use in checking the other sides after that.
So my original unoptimized performance check was this (Actionscript 3):
Continue reading...
The higher-level bounding collision detection is often done with either a bounding box or a bounding circle (for 2D). The question is, which is faster? With bounding boxes you are checking all four sides of the boxes to see if they overlap. With bounding circles you are checking the distance between two circles and comparing it to their combined radiuses (radii).
Update:
Following a comment from "C coder" below, I found that my previous method for checking bounding box collision was not optimized. Previously I had checked all 4 sides in one "if statement". After further testing, it turns out that checking each side individually is faster. This is because if the first bounding box's right side is less than the other bounding box's left side, there can be no collision and there's no use in checking the other sides after that.
So my original unoptimized performance check was this (Actionscript 3):
Continue reading...
Posted November 17, 2010 by Nick Vogt in Programming
Most game programmers are familiar with the distance (magnitude) equation and how inefficient it is. Using a square root is a costly function that usually can't be afforded many times per frame. Here is a much more efficient distance equation for situations in which you want to check the distance against a threshold (such as determining if two bounding spheres collide).
Here is the original distance formula:
Distance = Sqrt( (x2 - x1)² + (y2 - y1)² )
And here it is expanded into simple multiplication :
Distance * Distance = (x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1)
(For 3D be sure to add the z part of the formula)
Using simple multiplication results in extremely fast calculations. Here are some performance tests I ran in Actionscript 3. Other programming languages should be similar. I started with the traditional distance equation:
Looping the above code 10,000,000 iterations resulted in a total process time of 4387 milliseconds. Now here is the simple multiplication version:
Continue reading...
Here is the original distance formula:
Distance = Sqrt( (x2 - x1)² + (y2 - y1)² )
And here it is expanded into simple multiplication :
Distance * Distance = (x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1)
(For 3D be sure to add the z part of the formula)
Using simple multiplication results in extremely fast calculations. Here are some performance tests I ran in Actionscript 3. Other programming languages should be similar. I started with the traditional distance equation:
dist = Math.sqrt(Math.pow(x2 - x1,2) + Math.pow(y2 - y1,2));
if(dist < minDist)
{
// Perform action
}
if(dist < minDist)
{
// Perform action
}
Looping the above code 10,000,000 iterations resulted in a total process time of 4387 milliseconds. Now here is the simple multiplication version:
Continue reading...
Posted November 16, 2010 by Nick Vogt in Programming
In Actionscript 3 there are usually different coding methods to achieve the same output (this can be said of any programming language). Variables can be declared in different ways, math equations can be performed in different ways, you can move code into functions, perform things on single lines or multiple lines, and so on and so forth. While different methods may achieve the same output, certain methods are often faster than others. This post is dedicated to finding as many performance tweaks and enhancements as I can, and I will update it as I find more.
Methodology: For each test, I use the following loop to determine the relative duration of processing time. I use 500,000 iterations (or more in some cases) so that small differences in performance between code are exacerbated. Usually, any variables that I use in the test are initialized before the timed loop, to eliminate their initialization time from the test. That is unless I'm testing the performance including initialization. I also run the test multiple times to get the average time.
Continue reading...
Methodology: For each test, I use the following loop to determine the relative duration of processing time. I use 500,000 iterations (or more in some cases) so that small differences in performance between code are exacerbated. Usually, any variables that I use in the test are initialized before the timed loop, to eliminate their initialization time from the test. That is unless I'm testing the performance including initialization. I also run the test multiple times to get the average time.
var i:int;
var time1 = getTimer();
for(i = 0; i < 500000; i ++)
{
// Code to test
}
var time2 = getTimer();
trace(time2 - time1);
var time1 = getTimer();
for(i = 0; i < 500000; i ++)
{
// Code to test
}
var time2 = getTimer();
trace(time2 - time1);
Continue reading...
Posted November 16, 2010 by Nick Vogt in Programming
Functions are useful tools that allow you to reuse code, reducing file size and keeping your application better organized. There is a trade-off however, and that is function overhead. An Actionscript 3 application will take a small hit in performance when moving a section of code out of the normal flow of the program and into a function.
This hit is very minimal in most cases, so you shouldn't avoid using functions by any means. For example, if you're only calling a function once per frame the overhead will be non-existent. Code organization is more important in these cases.
A case where function overhead could become a problem is when a function is called many times per frame. Perhaps you have a function that calculates a vector for projectiles, and you have thousands of projectiles being created per frame at times. In this case, it may be better to include the vector calculation in with the normal flow of code and avoid using a function, even if that vector calculation needs to be in a couple different areas.
Unfortunately the actual performance difference is difficult to measure. The following test took 572 milliseconds:
Continue reading...
This hit is very minimal in most cases, so you shouldn't avoid using functions by any means. For example, if you're only calling a function once per frame the overhead will be non-existent. Code organization is more important in these cases.
A case where function overhead could become a problem is when a function is called many times per frame. Perhaps you have a function that calculates a vector for projectiles, and you have thousands of projectiles being created per frame at times. In this case, it may be better to include the vector calculation in with the normal flow of code and avoid using a function, even if that vector calculation needs to be in a couple different areas.
Unfortunately the actual performance difference is difficult to measure. The following test took 572 milliseconds:
Continue reading...