可以使用glsl代替webgl吗？ [英] Can glsl be used instead of webgl?

问题描述

这可能是一个幼稚的问题，所以请对我轻松一点。但是我在 shadertoy.com 上查看着色器，我对3d场景的glsl代码这么小感到惊讶。深入研究，我注意到大多数着色器如何使用称为光线行进。

This may be a bit of a naive question so please go easy on me. But I was looking at shaders at shadertoy.com and I'm amazed at how small the glsl code is for the 3d scenes. Digging deeper I noticed how most of the shaders use a technique called ray marching.

此技术可以避免完全使用顶点/三角形，而仅使用像素着色器和一些数学运算就可以创建一些非常复杂的图形

This technique makes it possible to avoid using vertices/triangles altogether and just employ the pixel shader and some math to create some pretty complex scenes.

所以我想知道为什么3d场景经常使用带有webgl的三角形网格而不是仅使用像素着色器。我们不能只使用glsl和像素着色器（又称为片段着色器）渲染整个场景吗？

So I was wondering why is it that 3d scenes often use triangle meshes with webgl instead of just using pixel shaders. Can't we just render the entire scene with glsl and pixel shaders (aka fragment shaders)?

推荐答案

简单的答案是因为与使用顶点和三角形相比，使用shadertoy的技术可能要慢10,100,1000倍。

The simple answer is because the techniques on shadertoy are probably 10,100,1000 times slower than using vertices and triangles.

比较以我的笔记本电脑上最佳全屏模式以1fps运行的shadertoy森林

Compare this shadertoy forest that runs at 1fps at best fullscreen on my laptop

https://www.shadertoy.com/view/4ttSWf

到以30至60fps运行的Skyrim森林

To this Skyrim forest which runs at 30 to 60fps

https://www.youtube.com/watch?v=PjqsYzBrP-M

比较这个在我的笔记本电脑上以5fps运行的Shadertoy城市

Compare this Shadertoy city which runs at 5fps on my laptop

https://www.shadertoy.com/view/XtsSWs

前往此城市：天际线城市以60fps运行

To this Cities:Skylines city which runs at 60fps

https://www.youtube.com/watch?v=0gI2N10QyRA

比较此Shadertoy Journey克隆版本，该克隆版本在我的笔记本电脑上全屏运行1fps

Compare this Shadertoy Journey clone which runs 1fps fullscreen on my laptop

https://www.shadertoy.com/view/ldlcRf

在PS3上进行实际的Journey游戏时，考虑到PS3的问世，该机的GPU可能比我的笔记本电脑要慢，但运行速度为60fps

to the actual Journey game on PS3, a machine with an arguably slower GPU than my laptop given the PS3 came out in 2006, and yet runs at 60fps

https://www.youtube.com/watch?v=61DZC-60x20#t = 0m46s

还有很多其他原因。典型的3D世界使用千兆字节的数据来处理纹理，角色，动画，碰撞等，只有GLSL才能提供这些数据。另一个是他们经常使用分形技术，因此没有一种设计实际的简单方法。相反，他们只是在数学中搜索一些有趣的东西。例如，这不是设计游戏关卡的好方法。换句话说，使用顶点数据可以使事情变得更加灵活和可编辑。

There's plenty of other reasons. A typical 3D world uses gigabytes of data for textures, characters, animations, collisions etc, none of that is available in just GLSL. Another is often they use fractal techniques so there's no easy way to actually design anything. Instead they just search the math for something interesting. That would not be a good way to design game levels for example. In other words using data of vertices makes things far more flexible and editable.

比较上面的旅程示例。 Shadertoy示例是与游戏相对的一个场景，游戏是一个广阔的设计世界，里面有建筑物，废墟和拼图等。

Compare the Journey examples above. The Shadertoy example is a single scene vs the game which is a vast designed world with buildings and ruins and puzzles etc...

有一个原因叫它Shader 玩具。这是一个有趣的挑战。给定一个仅输入当前正在绘制像素的函数，请编写代码以绘制一些内容。因此，鉴于限制，人们设法绘制的图像是惊人的！

There's a reason it's called ShaderTOY. It's a meant as a fun challenge. Given a single function who's only input is which pixel is currently being drawn, write code to draw something. As such the images people have managed to draw given that limit are amazing!

但是，它们通常不是用于编写真实应用的技术。如果您想让应用程序快速运行并变得灵活，请使用更传统的顶点和三角形技术。 GTA5，Red Dead Redemption 2，《使命召唤》，Apex Legends，Fortnite等使用的技术。

But, they aren't generally the techniques used to write real apps. If you want your app to run fast and be flexible you use the more traditional techniques of vertices and triangles. The techniques used by GTA5, Red Dead Redemption 2, Call of Duty, Apex Legends, Fortnite, etc....

这篇关于可以使用glsl代替webgl吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！