Scirra cog

About Us

We're a London based startup that develops Construct 2, software that lets you make your own computer games!

Archives

Browse all our blog posts

Latest Blog Entries

We love brains!

Join us! Joiiinnn ussss! Mooooree brains!

Construct 2 vs. Javascript

by Ashley | 29th, September 2011

Recently I read a comment on a blog along the lines of "why buy any HTML5 tools? It's really easy to do it yourself in javascript". I think this is an interesting question, so today I want to talk a little about how using Construct 2 to make HTML5 games compares to writing those games "by hand" - in Javascript and HTML. There are some obvious differences, but some more hidden advantages to using Construct 2. So what exactly is Construct 2 doing for you? How does writing the Javascript code yourself compare?

The obvious things

First of all, the most obvious thing is you have to know how to program to write HTML5 games in Javascript. Construct 2 lets you skip all the coding using the event system, which can be a lot faster too once you've gotten used to it. Let's suppose you went on anyway to learn Javascript. It's not a bad language, but it has lots of quirks that might cause you stumbling blocks (see how long that list is!). On top of that, different browsers have their different quirks, so you'd also have to learn workarounds for various browsers.

Next most obvious is programming is all done by text. This means you don't have anything resembling Construct 2's visual editors. Instead of visually designing levels, often programmers resort to typing in long lists of object co-ordinates. Then, imagine setting an object's collision polygon by typing in each point's co-ordinates, or writing code to run animations! Some programmers get around this by writing their own tools to help, but then that's even more work on top of designing your game! You could do an awful lot of work on your tools before you've even started the game. Construct 2 has these visual tools built in already. And imagine if you didn't have any tools - it's incredibly hard to be productive typing in lists of co-ordinates, and hardly intuitive.

Defining a level via javascript code

Defining a level via javascript code vs. Construct 2's visual editors (below)

Construct 2's layout editor

Construct 2's collision polygon editor

There's also reasonably complicated math in the average game. Do you know how to program a test for polygon intersection? How about the math necessary to work around the quirky way HTML5 canvas wants to display a rotated tiled texture? It's done for you in Construct 2. The behaviors are also surprisingly complex. Take the Platform behavior. You can see its source in the exporters\html5\behaviors\platform subfolder of the install path. It's about 600 lines of Javascript, taking care of many complicated aspects like push-out algorithms, slopes, moving platforms, and so on. If you're writing a platform game yourself, you're going to have to re-do all that work, and remember you'll be finding and fixing bugs along the way, as we've done. (We're happy to say our platform behavior works pretty well now!)

Don't forget Construct 2 helps you encode all your audio to both .ogg (all OSs) and .m4a (Windows 7+ only) to help reduce the download size and cover all browsers, since there isn't one format that works in all browsers.

The less obvious things

There are even some low-level technical advantages too. Suppose you've braced yourself: you're going to learn the language and its quirks, design your own tools, write all the math and movements, encode audio yourself, and so on. There are still two more things you need to get right.

First, will it run fast? Performance in Javascript is difficult. Your algorithms all have to be written optimally or browser engines will struggle. Construct 2's engine also takes advantage of new Javascript features like object sealing which helps guarantee the browser will run the code as fast as possible. Are you on top of the latest revisions to the Javascript standard?

Further, Javascript is a garbage-collected language. That means creating objects allocates memory, but the programmer doesn't say when it's released. Instead, the browser occasionally decides to search for the bits of memory which are no longer being used, and free them. That's called 'garbage collection'. Unfortunately garbage collection can take a lot of CPU time, and even cause your game to become noticeably jumpy, or even regularly freeze up momentarily! That's very annoying for action packed games. There are ways to work around this, but it can be difficult to factor this in to your own code. But don't worry! We've already optimised Construct 2's engine to create very little garbage. Even destroying and later creating a whole object doesn't leave the old object as garbage - it's recycled. So your games should very rarely have garbage collection pauses.

Finally, you want your script to have a small filesize. Downloading large scripts can leave users waiting and getting bored. Also, you might not want anyone to steal your game's code. Construct 2 uses Google's 'Closure Compiler' for Javascript. This simultaneously compacts the script reducing the filesize, and renames everything in the script to random obscure names, making it extremely difficult for anybody to understand or reverse-engineer the code. It works so well Construct 2's script overhead is about 60kb. That's less than jQuery, and probably about the size of the image for your player's first animation frame. Did I mention to get the best compacting and obscuring you have to use the 'Advanced Optimization' mode, which imposes stringent limitations on the way you write your Javascript? That's another hoop for the Javascript programmer to jump through - but of course, the Construct 2 engine is already written for this.

Some of Construct 2's output javascript

Some of Construct 2's output javascript, compressed and mangled by Google's Closure Compiler Advanced mode. Not easy to reverse engineer!

One more thing - do you want physics in your game? Have you got code to decompose concave polygons in to multiple convex polygons so physics collisions work correctly? Have you learned about Box2D's fixtures, bodies, joints, correct world stepping, and so on? If you want physics in your HTML5 game, that's another whole can of worms.

Construct 2 does it for you

So spare a thought for the Javascript game programmer as you're working on your Construct 2 game. It's not easy for them. There are plenty of hurdles. Perhaps that commenter may have some new appreciation for the great deal Construct 2's Javascript runtime does for you behind the scenes. A surprising amount of work has gone in to it: optimisation, browser quirks, algorithms, math and more - not to mention the easy-peasy visual editors you get on top of that. It's not just a time-saver (and a big time-saver at that) - there are real technical advantages too. So I hope that quells any doubts over Construct 2's utility. It's not some thin Javascript library: it's a complete development system, and it's doing a whole lot more for you than you might have thought.

Now follow us and share this

Tags:

Comments

8
Ghengis 5,668 rep

Interestingly, one of my first posts on the forum was about me describing how I originally started to code my HTML5 game by hand! It took forever and it was very slow. Construct 2 was a life saver.

I was productive in the first few hours of having launched the program. I've yet to find a situation where Construct 2 was not up to the task or where I wasn't able to find a workaround via a blunt code insert or creating a custom behavior.

Thursday, September 29, 2011 at 3:15:27 AM
8
davidshq 2,516 rep

Great post. I think you create a fairly comprehensive case for Construct2. A few items I'd point out from a "devil's advocate" perspective:
1. I think the bigger question is how Construct2 compares to other similar engines currently available (or about to become available).
2. One of the big issues with number 1 above is the future of Construct2. How can one know that Construct2 will be around for a while? Especially with companies like Microsoft and Adobe jumping on the tool creation bandwagon...
3. Javascript coders would probably respond that Construct2 lacks the flexibility of pure Javascript and that it is also possible to better optimize from a pure code development point of view...though I agree that the load in learning all of these techniques and programming them may outweigh the gained performance/flexibility over construct.

Thursday, September 29, 2011 at 3:43:03 AM
6
Ashley 188.0k rep

@davidshq - good points, to answer:
1. Other tools either don't have good visual editors, or are vulnerable to garbage-collection pauses. We've also seen other tools also generating vast amounts of javascript (over half a megabyte!). I think you'll be hard pressed to find another tool which does so well in those areas.
2. We recently accepted investment (see 2 blog posts back), so we're here to stay for the foreseeable future. Also, MS and Adobe seem focused on scripting tools, or tools aimed at kids (e.g. Kodu), whereas we're designing Construct 2 to be useful for everybody.
3. Obviously if you know how to program you're going to criticise the event system. Remember we're targeting at non-coders. However, it saves so much time (you can get a platformer going in minutes, and see our YouTube video of physics in 60 seconds) that it's really useful even for seasoned programmers - I love using it myself! On top of that we have a Javascript SDK so you can in fact integrate APIs, intense algorithms (see Kyatric's Pathfinding behavior) and so on in code if you so wish.
Hope that answers your points. Feel free to ask any more, happy to offer my opinion :)

Thursday, September 29, 2011 at 1:49:07 PM
3
TehLulzinator 4,204 rep

tl;dr Construct 2 lets you make games for the sake of making games!

I did read it though no offense meant. ;)

I think the greatest advantage is that Construct 2 has much optimization, and might have even more in the future, where I wouldn't manage to optimize at all.

Thursday, September 29, 2011 at 2:53:09 PM
1
VampyricalCurse 8,331 rep

I didn't think this needed to be cleared up. It's not even a question as to why C2 is useful? You do not need to be genius to see this, IMHO. I have used programming languages, and I tell you I will never go back. It's so time consuming to make games solely by typing code, I do not support it, it has been years I have given up on that. If it makes some people feel more accomplished to type, and make yer game super time consuming to make, then by all means, do it. Be careful not to be left behind though.

Friday, September 30, 2011 at 12:08:47 AM
1
prinsukun 5,117 rep

I think some people forgot what "TIME" matter for making games :D
it's not what programing skills give you, but it's how you can be more productive using your favorite game engine.

Friday, September 30, 2011 at 5:28:00 PM
2
TheOctagonTheory 2,391 rep

davidshq, you mentioned comparative engines that are or will be available. I know of Appcelerator Titanium, Impact, GameMaker 4 HTML5. Are there any others?

Tuesday, October 04, 2011 at 7:31:43 AM
1
davidshq 2,516 rep

@Ashley - Thanks for the detailed replies. I agree with your sentiments and am working through some tutorials on Construct2, eager to try my hand at a grand strategy turn-based game.
@TheOctagonTheory - Hmmm...Can't comment on their quality but a few others I've seen are Akihabara, Cloudmach, Isogenic Engine, and Rocket Engine.

Tuesday, October 11, 2011 at 4:21:35 AM
-1
programaths 4,353 rep

We are going toward more high level languages.
And even going back to DSL ! (Domain Specific Languages, cf : http://wiki.eclipse.org/Xtext)

These are a lot of programming paradigms and Construct can be seen as one of them. Although people won't think they are actually programming...they do !

But you can still instruct wrong behavior if you haven't the right logic. Construct can't think for you but only make you do the things faster and at an higher level.

When construct will include ways of sharing behaviors or some kind of heritage, then it will be very expressive.

In the 1.0 version, there was families and functions. It seems that it was already complex enough for people to handle not so used. Lot of duplicate logic.

Also, it is not because you use an high level language that you are free to learn how things are done or at least have a fair idea of it. If you don't, you'll be in trouble figuring out why things aren't working as expected.

For example, you may want to sort an array. Calling the method "sort()" would seems natural but if you are most of the time sorting a quite sorted array, maybe it is better to see if that method does permit you to choose a specific algorithm more suited for your kind of data.

So, the good point of Construct & Co : Making things easiers.
The bad point : Giving illusion of easiness !

For those who know : Compare "edline" and "eclipse" and see how far we've gone !

Sunday, October 23, 2011 at 2:25:46 PM
0
tonycrew 9,442 rep

For me i can't code JS and if i wanted to learn i could make Plugins, So i get the best of both worlds, it should please both coders and non coders.
C2 does what it says on the tin.... Makes Games and Makes them FAST thats brilliant for people like me, and it's not too dificult to get your actions working how you want them to, And a great support community to go with that, as well as lots of updates..... What can i say Brilliant keep it up guys.

Sunday, November 20, 2011 at 12:13:34 PM
0
Bigheti 15.7k rep

Whereas the delivery of any project should meet the scope in time and cost pre-established, Construct 2 (C2) and assist it too much. But in some cases the JavaScript (JS) is essential for a better control of the object.
I believe that each case must be analyzed separately and decide which way to go: C2 or JS. Or both!
As a developer in programming language like Java, I know that the C2 is practical and helps in the question time and ease of use. Soon I'll buy it and recommend its purchase!

Wednesday, November 30, 2011 at 6:02:21 PM
0
israelbolu 427 rep

I prefer to use craftyjs with methods of entities and components, along with TexturePacker and PhysicsEditor

Tuesday, January 07, 2014 at 7:57:32 PM
0
exertia 2,620 rep

Here's a great presentation with perspective on HTML5 vs native and they also list out a lot of the Construct 2-like tools that are currently available:
www.developereconomics.com/downloads/can-html5-compete-native/

Its too bad that Construct 2 doesn't get enough press, and the team doesn't focus on marketing otherwise it could be on the top now.

Saturday, March 29, 2014 at 12:05:54 AM

Leave a comment

Everyone is welcome to leave their thoughts! Register a new account or login.