Today I have been working on displaying a table of model values with the ability to add new items to the collection they are in. It made sense to use Marionette’s CollectionView to manage the individual views for each model. It also conveniently will watch the collection for any add events and append a new view in to the DOM.
Here’s a quick tip for doing some simple performance measuring in Javascript. If you want to see how long a particular job takes you can use the new performance api like so:
Mark a starting point
window.performance.mark('custom_name')
End and measure
Once the job has completed you can tell the performance api to create a measurement between the current time and the mark you ceated earlier.
What do you get when you mix a few Leap Motion devices, a few eager developers and space invaders?
We found out at the recent Southville JS Workshop in Bristol. I have been excited about getting involved and I think we had a great workshop to finish the weekend off with some light-hearted fun.
Here are some of the key aspects we went through to program a simple Space Invaders controller using the Leap Motion.
It was great to be able to present at Bristol Skillswap last week. I’m new to the west and am really excited about getting involved in the community here.
I took a flight through my recent journey with United Studios Live and the 3d Audio Visualizer built in to their new website.
A whole new world of sound
The Web Audio API has given us loads of great new toys to play with inside the browser.
I have started a small collection of JavaScript Euclidean Vector
classes. These are
commonly used in creative programming. I wanted a quick way of adding
Vectors in to any project that may need them so they’re installable
from bower and have a basic set of methods available.
Set up
Currently there is 2 dimensional and 3 dimensional Vectors available.
Add references to the files to your project.
On starting a new project recently I started making notes on the kind of questions I would want to ask myself at the beginning of every project. I started writing them down and making notes around each one but the article has become a little large so I’m going to do a series instead.
JavaScript Code Quality and JsHint
I’m going to start off looking at JavaScript, in fact more specifically for this article JsHint.
I’ve been doing a fair amount of creative and 3d programming recently.
One major drawback of using something like WebGL at the moment is that
it isn’t natively supported on many mobile devices and falling back to
something like the Three.js canvas 2d renderer is very slow.
So I’ve been playing around with using CSS 3D transforms to see what
you can achieve. Here’s an example of a simple scene showing boxes being
dropped on to a plane (Click the window to drop them).
I have been working with Canvas 2D and WebGL recently and have been
using Maths I never expected to see again once I left school. One
thing that has been really useful when turning mathematical functions
in to something visual is to see a graph representation of the values.
I have created a [simple graphing playground](/teststation/creative-
js/grapher/2d.html) to test out these functions and compare them to
each other. You can see below the difference between the sin, cos
and tan functions alongside the ImprovedNoise generator built in
to Three.js.
I had the pleasure of presenting at AKQA Anoraks in London on thursday. It was a great packed evening. I gave a talk on my adventure over the last few months of building my simple Space Invaders game. Even though it’s a pretty simple game I have learnt enough to talk about it or half an hour.
I began building a very simple HTML5 racer game back in November. It was my first exploration in to doing simple games with HTML5 and canvas.
It has lay dormant for a while, I’m going to take it another step further and put the car on a track in this article and inflict some speed drag when the car is not on the track.
Dave Taylor - Software Engineer
