diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js
index 36560a9..16b2cec 100644
--- a/src/core/renderers/webgl/filters/Filter.js
+++ b/src/core/renderers/webgl/filters/Filter.js
@@ -1,4 +1,7 @@
-var extractUniformsFromSrc = require('./extractUniformsFromSrc');
+var extractUniformsFromSrc = require('./extractUniformsFromSrc'),
+    utils = require('../../../utils'),
+    SOURCE_KEY_MAP = {};
+
 // var math = require('../../../math');
 /**
  * @class
@@ -38,20 +41,24 @@
         this.uniforms[i] = this.uniformData[i].value;
     }
 
-    // this.uniforms =
     // this is where we store shader references..
     // TODO we could cache this!
     this.glShaders = [];
 
-    // used for cacheing..
-    this.glShaderKey = null;
+    // used for cacheing.. sure there is a better way!
+    if(!SOURCE_KEY_MAP[this.vertexSrc + this.fragmentSrc])
+    {
+        SOURCE_KEY_MAP[this.vertexSrc + this.fragmentSrc] = utils.uid();
+    }
+
+    this.glShaderKey = SOURCE_KEY_MAP[this.vertexSrc + this.fragmentSrc];
 
     this.padding = 4;
     this.resolution = 1;
 }
 
 // constructor
-Filter.prototype.constructor = Filter;
+//Filter.prototype.constructor = Filter;
 module.exports = Filter;
 
 // var tempMatrix = new math.Matrix();

diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js
index 36560a9..16b2cec 100644
--- a/src/core/renderers/webgl/filters/Filter.js
+++ b/src/core/renderers/webgl/filters/Filter.js
@@ -1,4 +1,7 @@
-var extractUniformsFromSrc = require('./extractUniformsFromSrc');
+var extractUniformsFromSrc = require('./extractUniformsFromSrc'),
+    utils = require('../../../utils'),
+    SOURCE_KEY_MAP = {};
+
 // var math = require('../../../math');
 /**
  * @class
@@ -38,20 +41,24 @@
         this.uniforms[i] = this.uniformData[i].value;
     }
 
-    // this.uniforms =
     // this is where we store shader references..
     // TODO we could cache this!
     this.glShaders = [];
 
-    // used for cacheing..
-    this.glShaderKey = null;
+    // used for cacheing.. sure there is a better way!
+    if(!SOURCE_KEY_MAP[this.vertexSrc + this.fragmentSrc])
+    {
+        SOURCE_KEY_MAP[this.vertexSrc + this.fragmentSrc] = utils.uid();
+    }
+
+    this.glShaderKey = SOURCE_KEY_MAP[this.vertexSrc + this.fragmentSrc];
 
     this.padding = 4;
     this.resolution = 1;
 }
 
 // constructor
-Filter.prototype.constructor = Filter;
+//Filter.prototype.constructor = Filter;
 module.exports = Filter;
 
 // var tempMatrix = new math.Matrix();
diff --git a/src/core/sprites/webgl/SpriteRenderer.js b/src/core/sprites/webgl/SpriteRenderer.js
index 5f1095b..637eafc 100644
--- a/src/core/sprites/webgl/SpriteRenderer.js
+++ b/src/core/sprites/webgl/SpriteRenderer.js
@@ -81,8 +81,10 @@
     this.vertexBuffers = [];
     this.vaos = [];
 
-    this.vaoMax = 20;
+    this.vaoMax = 2;
     this.vertexCount = 0;
+
+    this.renderer.on('prerender', this.onPrerender, this);
 }
 
 
@@ -126,6 +128,11 @@
     this.currentBlendMode = 99999;
 };
 
+SpriteRenderer.prototype.onPrerender = function ()
+{
+    this.vertexCount = 0;
+}
+
 /**
  * Renders the sprite object.
  *
@@ -281,12 +288,23 @@
     currentGroup.size = i - currentGroup.start;
 
     this.vertexCount++;
-    this.vertexCount %= this.vaoMax;
+
+    if(this.vaoMax <= this.vertexCount)
+    {
+        this.vaoMax++;
+        this.vertexBuffers[this.vertexCount] = glCore.GLBuffer.createVertexBuffer(gl, null, gl.STREAM_DRAW);
+        // build the vao object that will render..
+        this.vaos[this.vertexCount] = this.renderer.createVao()
+        .addIndex(this.indexBuffer)
+        .addAttribute(this.vertexBuffers[this.vertexCount], this.shader.attributes.aVertexPosition, gl.FLOAT, false, this.vertByteSize, 0)
+        .addAttribute(this.vertexBuffers[this.vertexCount], this.shader.attributes.aTextureCoord, gl.UNSIGNED_SHORT, true, this.vertByteSize, 2 * 4)
+        .addAttribute(this.vertexBuffers[this.vertexCount], this.shader.attributes.aColor, gl.UNSIGNED_BYTE, true, this.vertByteSize, 3 * 4)
+        .addAttribute(this.vertexBuffers[this.vertexCount], this.shader.attributes.aTextureId, gl.FLOAT, false, this.vertByteSize, 4 * 4);
+    }
 
     this.vertexBuffers[this.vertexCount].upload(buffer.vertices, 0);
     this.vao = this.vaos[this.vertexCount].bind();
 
-
     /// render the groups..
     for (i = 0; i < groupCount; i++) {
 

diff --git a/src/core/renderers/webgl/filters/Filter.js b/src/core/renderers/webgl/filters/Filter.js
index 36560a9..16b2cec 100644
--- a/src/core/renderers/webgl/filters/Filter.js
+++ b/src/core/renderers/webgl/filters/Filter.js
@@ -1,4 +1,7 @@
-var extractUniformsFromSrc = require('./extractUniformsFromSrc');
+var extractUniformsFromSrc = require('./extractUniformsFromSrc'),
+    utils = require('../../../utils'),
+    SOURCE_KEY_MAP = {};
+
 // var math = require('../../../math');
 /**
  * @class
@@ -38,20 +41,24 @@
         this.uniforms[i] = this.uniformData[i].value;
     }
 
-    // this.uniforms =
     // this is where we store shader references..
     // TODO we could cache this!
     this.glShaders = [];
 
-    // used for cacheing..
-    this.glShaderKey = null;
+    // used for cacheing.. sure there is a better way!
+    if(!SOURCE_KEY_MAP[this.vertexSrc + this.fragmentSrc])
+    {
+        SOURCE_KEY_MAP[this.vertexSrc + this.fragmentSrc] = utils.uid();
+    }
+
+    this.glShaderKey = SOURCE_KEY_MAP[this.vertexSrc + this.fragmentSrc];
 
     this.padding = 4;
     this.resolution = 1;
 }
 
 // constructor
-Filter.prototype.constructor = Filter;
+//Filter.prototype.constructor = Filter;
 module.exports = Filter;
 
 // var tempMatrix = new math.Matrix();
diff --git a/src/core/sprites/webgl/SpriteRenderer.js b/src/core/sprites/webgl/SpriteRenderer.js
index 5f1095b..637eafc 100644
--- a/src/core/sprites/webgl/SpriteRenderer.js
+++ b/src/core/sprites/webgl/SpriteRenderer.js
@@ -81,8 +81,10 @@
     this.vertexBuffers = [];
     this.vaos = [];
 
-    this.vaoMax = 20;
+    this.vaoMax = 2;
     this.vertexCount = 0;
+
+    this.renderer.on('prerender', this.onPrerender, this);
 }
 
 
@@ -126,6 +128,11 @@
     this.currentBlendMode = 99999;
 };
 
+SpriteRenderer.prototype.onPrerender = function ()
+{
+    this.vertexCount = 0;
+}
+
 /**
  * Renders the sprite object.
  *
@@ -281,12 +288,23 @@
     currentGroup.size = i - currentGroup.start;
 
     this.vertexCount++;
-    this.vertexCount %= this.vaoMax;
+
+    if(this.vaoMax <= this.vertexCount)
+    {
+        this.vaoMax++;
+        this.vertexBuffers[this.vertexCount] = glCore.GLBuffer.createVertexBuffer(gl, null, gl.STREAM_DRAW);
+        // build the vao object that will render..
+        this.vaos[this.vertexCount] = this.renderer.createVao()
+        .addIndex(this.indexBuffer)
+        .addAttribute(this.vertexBuffers[this.vertexCount], this.shader.attributes.aVertexPosition, gl.FLOAT, false, this.vertByteSize, 0)
+        .addAttribute(this.vertexBuffers[this.vertexCount], this.shader.attributes.aTextureCoord, gl.UNSIGNED_SHORT, true, this.vertByteSize, 2 * 4)
+        .addAttribute(this.vertexBuffers[this.vertexCount], this.shader.attributes.aColor, gl.UNSIGNED_BYTE, true, this.vertByteSize, 3 * 4)
+        .addAttribute(this.vertexBuffers[this.vertexCount], this.shader.attributes.aTextureId, gl.FLOAT, false, this.vertByteSize, 4 * 4);
+    }
 
     this.vertexBuffers[this.vertexCount].upload(buffer.vertices, 0);
     this.vao = this.vaos[this.vertexCount].bind();
 
-
     /// render the groups..
     for (i = 0; i < groupCount; i++) {
 
diff --git a/src/index.js b/src/index.js
index 28e86ad..6596b1d 100644
--- a/src/index.js
+++ b/src/index.js
@@ -11,7 +11,7 @@
 core.mesh           = require('./mesh');
 core.particles      = require('./particles');
 core.accessibility  = require('./accessibility');
-core.extract  = require('./extract');
+core.extract  		= require('./extract');
 
 // export a premade loader instance
 /**