What is the best way to implement my own shader?

[Qqwy]

I am working on a Bullet Hell game. To make it visually more interesting, I used glsl.js and wrote a shader that displays the game as if on a CRT screen.

More recently though, I figured out more about the inner workings of Pixi.js, and finally got the WebGLRenderer working. But now I have a performance problem:

-glsl.js reading from a Pixi.CanvasRenderer works fine(30fps), but starts to lag A LOT when there are a few more bullets on the screen.

-just a Pixi.WebGLRenderer without the extra glsl.js layer works extremely fast(60+fps), even with many bullets on the screen.

-Combining the Pixi.WebGLRenderer with glsl.js makes everything go horribly sluggish(15fps or lower).

 

Of course, the third option is what I want to use in the future. My best bet is that it is so slow is because Pixi.js places the Stage in a canvas, which is then again read by glsl.js. This step of placing image data and then grabbing it again is something that could be averted if I could pass the texture of a RenderTexture directly to glsl.js to be used as an Sampler2d object.

 

So... how do I do this? Or are there other, easier ways to implement my own shader right now using only PIXI.js?

[xerver]

RIght now, no custom shaders are not supported. However, soon Filters will be up and you will have access to more things like that soon after.

[user123]

Strange..

http://wmmusic.nl/codexamples/pixijs/v19/smuv2.html

The above gives me a severe lag spike while colliding with an enemy.

Is it just me or do other people have this too?

p.s. Im using firefox 28, the newest version afaik