Depth of field - DOF - Bokeh

I was reading this about depth of field with playcanvas.
Next I tried to get the scripts from the Titanfall project working in my own project but I don’t get them to work:

https://playcanvas.com/editor/code/6461/posteffect_dof.js
https://playcanvas.com/editor/code/6461/posteffect_dof2.js
https://playcanvas.com/editor/code/6461/bokeh.js

Is there any newer sample which creates a depth of field effect?

They use older script system, you need to change them to newer one.

This was my first thought too, but then I read that: The legacy script system is still available for new and existing projects…

But ok, I will try to update one of these scripts to the newer script system.

Maybe you could give me an advise which one of these three scripts is the best for the use in a product viewer for jewelry?
I only want to make the back part of my product a bit of blurry, not much. The front part, facing to the rotating camera should stay sharp. And it shouldn’t cost to much of my frame rate.

Thank you for helping me.

Post effects such as DoF and Bokeh - are very expensive, and for mobile especially they are not going to give you good performance, as they both require complex blurring - which is expensive.

And post effects require rendering into Render Target, WebGL 1.0 unfortunately does not support Anti Aliasing for Render Targets, so you’ll get AA issues, so would require to add some FXAA or similar technique.

Here are some post effects from store, that work with new script system: https://store.playcanvas.com/?tags=script Good point to start from.