4 ms·

Physically Based Rendering Comes to WebGL

83 points by MayorOfMonkeys 12y ago

swalsh 12y ago
This is the first time I've seen playcanvas. It's a very impressive platform so far. A pretty good potential competitor with unity in the future?
- bhouston 12y ago
  PlayCanvas is very nice! And nice people as well. It is hard to compete with Unity with the same efficiency on all the non-web platforms platforms supported by Unity when it has to run in a browser/JavaScript. But for web-based games PlayCanvas beats out Unity clearly.
  - nacs 12y ago
    > But for web-based games PlayCanvas beats out Unity clearly. For the moment at least, if you discount the Unity plugin approach. Unity 5, the coming version, features a (plugin-less) WebGL-export (and I believe the Unity 5 beta already supports it): https://blog.mozilla.org/blog/2014/03/18/mozilla-and-unity-bring-unity-game-engine-to-webgl/ https://blog.mozilla.org/blog/2014/03/18/mozilla-and-unity-b...
    - bhouston 12y ago
      To a degree, but Unity 5 isn't at all like a JavaSCript app. It's WebGL approach is basically to convert C++ and C# -> JavaScript via emScripten. It is a messy approach and it doesn't really take advantage of what the web offers -- because you still create your game in C#. I think anyone that wants to target the web primary should use something that isn't based on a large emScripten blob as their engine. This will become more and more of a liability as time goes on. But this does give Unity 5 a checkbox besides WebGL.
    - daredevildave 12y ago
      The Unity WebGL export is great news. It is pushing forward the platform. However, the reality is that they are desktop only, at least for the foreseeable future. The Emscripten Webplayer generates a significant blob of Javascript which doesn't work well on mobile. Raw Javascript engine's like PlayCanvas are ~500Kb compared to ~10MB for Unity in Javascript.
- duaneb 12y ago
  Maybe, but performance is still pretty terrible for a number of reasons (GC/optimized features vary greatly across browsers) compared to one run by a more static VM. As a raw GPU driver, it works pretty well, though.
mauricesvay 12y ago
also https://labs.sketchfab.com/siggraph2014/ https://labs.sketchfab.com/siggraph2014/
- mrmoka 12y ago
  Weird, but sketchfab demo is really slow here.
  - bhouston 12y ago
    It seems broken right now. I think this was a special purpose demo. It did work back when it was released.
- Maken 12y ago
  I love how the physically-based model include an ambient map. Because you can't have those with Blinn-Phong shading. Also, by physically-based rendering I assume they mean physically-plausible shaders.
bhouston 12y ago
Sweet! Beautiful work. PS. https://Clara.io https://Clara.io also has support for physically-based rendering in WebGL, just use the "Physical" material. :)
- mrmoka 12y ago
  Nice! Is there are any nice demo with CubeMaps?
  - bhouston 12y ago
    It isn't yet officially released so I am not yet showing off the demos. But you can try it yourself, just create a new scene and add a Physical material to an object. From a technical perspective, it is an implementation of GGX, Schlick, Anisotropy/Anisotropy Rotation, Translucent SSS, and Clear Coat.
  - duaneb 12y ago
    I gotta say, it's mighty ironic to use CubeMaps when testing out physically based rendering. Clearly, only the material is physically based :P
kagia 12y ago
It worked really well for me, and I hope to see some more demos!
solarmist 12y ago
Did anyone else think of the book when they read the title? http://www.pbrt.org/ http://www.pbrt.org/
- bhouston 12y ago
  That is where this originated, at least in part. :) BTW one of the best references is this: http://blog.selfshadow.com/publications/s2013-shading-course/ http://blog.selfshadow.com/publications/s2013-shading-course...
Htsthbjig 12y ago
Worked in Firefox with a recent iMac, but slow in fullscreen. So I opened it in chrome and it hangs my iMac. I do graphics programming and use 3D a lot, and it is the first time my machine hangs.
- Raticide 12y ago
  Runs fullscreen in Chrome on my iMac just fine. Framerate isn't so hot though.

This is the first time I've seen playcanvas. It's a very impressive platform so far. A pretty good potential competitor with unity in the future?

bhouston 12y ago
PlayCanvas is very nice! And nice people as well. It is hard to compete with Unity with the same efficiency on all the non-web platforms platforms supported by Unity when it has to run in a browser/JavaScript. But for web-based games PlayCanvas beats out Unity clearly.
- nacs 12y ago
  > But for web-based games PlayCanvas beats out Unity clearly. For the moment at least, if you discount the Unity plugin approach. Unity 5, the coming version, features a (plugin-less) WebGL-export (and I believe the Unity 5 beta already supports it): https://blog.mozilla.org/blog/2014/03/18/mozilla-and-unity-bring-unity-game-engine-to-webgl/ https://blog.mozilla.org/blog/2014/03/18/mozilla-and-unity-b...
  - bhouston 12y ago
    To a degree, but Unity 5 isn't at all like a JavaSCript app. It's WebGL approach is basically to convert C++ and C# -> JavaScript via emScripten. It is a messy approach and it doesn't really take advantage of what the web offers -- because you still create your game in C#. I think anyone that wants to target the web primary should use something that isn't based on a large emScripten blob as their engine. This will become more and more of a liability as time goes on. But this does give Unity 5 a checkbox besides WebGL.
  - daredevildave 12y ago
    The Unity WebGL export is great news. It is pushing forward the platform. However, the reality is that they are desktop only, at least for the foreseeable future. The Emscripten Webplayer generates a significant blob of Javascript which doesn't work well on mobile. Raw Javascript engine's like PlayCanvas are ~500Kb compared to ~10MB for Unity in Javascript.
duaneb 12y ago
Maybe, but performance is still pretty terrible for a number of reasons (GC/optimized features vary greatly across browsers) compared to one run by a more static VM. As a raw GPU driver, it works pretty well, though.

mauricesvay 12y ago

also https://labs.sketchfab.com/siggraph2014/ https://labs.sketchfab.com/siggraph2014/

mrmoka 12y ago
Weird, but sketchfab demo is really slow here.
- bhouston 12y ago
  It seems broken right now. I think this was a special purpose demo. It did work back when it was released.
Maken 12y ago
I love how the physically-based model include an ambient map. Because you can't have those with Blinn-Phong shading. Also, by physically-based rendering I assume they mean physically-plausible shaders.

bhouston 12y ago

Sweet! Beautiful work. PS. https://Clara.io https://Clara.io also has support for physically-based rendering in WebGL, just use the "Physical" material. :)

mrmoka 12y ago
Nice! Is there are any nice demo with CubeMaps?
- bhouston 12y ago
  It isn't yet officially released so I am not yet showing off the demos. But you can try it yourself, just create a new scene and add a Physical material to an object. From a technical perspective, it is an implementation of GGX, Schlick, Anisotropy/Anisotropy Rotation, Translucent SSS, and Clear Coat.
- duaneb 12y ago
  I gotta say, it's mighty ironic to use CubeMaps when testing out physically based rendering. Clearly, only the material is physically based :P

kagia 12y ago

It worked really well for me, and I hope to see some more demos!

solarmist 12y ago

Did anyone else think of the book when they read the title? http://www.pbrt.org/ http://www.pbrt.org/

bhouston 12y ago
That is where this originated, at least in part. :) BTW one of the best references is this: http://blog.selfshadow.com/publications/s2013-shading-course/ http://blog.selfshadow.com/publications/s2013-shading-course...

Htsthbjig 12y ago

Worked in Firefox with a recent iMac, but slow in fullscreen. So I opened it in chrome and it hangs my iMac. I do graphics programming and use 3D a lot, and it is the first time my machine hangs.

Raticide 12y ago
Runs fullscreen in Chrome on my iMac just fine. Framerate isn't so hot though.