与使用Quads的网格相比,Three.js加载已被三角剖分的网格是否更有性能? [英] Is it more performant for three.js to load a mesh that's already been triangulated than a mesh using quads?

查看:109
本文介绍了与使用Quads的网格相比,Three.js加载已被三角剖分的网格是否更有性能?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经读过Three.js对所有网格面进行了三角剖分,对吗?

I've read that Three.js triangulates all mesh faces, is that correct?

然后,我意识到我一直使用的大多数gltf模型都具有四面体.在Blender中对面进行三角剖分非常容易,因此我很好奇是否对面进行预三角剖分会导致网格加载更快?

Then I realized that most of the gltf models I've been using have quad faces. It's very easy to triangulate faces in Blender so I'm curious if pre-triangulating the faces will result in quicker load of the mesh?

预先感谢您,如果您对three.js和gltf有其他性能提示(除了

Thanks in advance, and if you have any other performance tips on three.js and gltf's (besides those listed at https://discoverthreejs.com/tips-and-tricks/) that would be super helpful!

推荐答案

glTF当前格式不支持四边形面,仅支持三角形.当前的glTF导出器(包括Blender)在创建glTF文件时会对模型进行三角测量.有些会在导入时自动尝试将它们合并在一起.

glTF, in its current form, does not support quad faces, only triangles. Current glTF exporters (including Blender) triangulate the model when creating the glTF file. Some will automatically try to merge things back together on import.

通过设计,glTF以类似于WebGL顶点属性的方式存储其数据,从而可以以最少的预处理高效地进行渲染.但是创建模型时,您可以做一些事情,以帮助实现这些目标:

By design, glTF stores its data in a similar manner to WebGL's vertex attributes, such that it can render efficiently, with minimal pre-processing. But there are some things you can do when creating a model, to help it reach these goals:

  • 尽可能合并材料,以减少绘图调用的次数.
  • 尽可能合并网格/基元,以减少绘制次数.
  • 请注意,不连续的法线/UV增加了顶点数(再次由于顶点属性).
  • 避免创建充满纯色的纹理.改用Blender的默认颜色/值节点输入.
  • 使纹理大小保持Web友好性,并具有2的功效.移动客户端有时无法处理大于2048x2048的内容.也可以尝试1024x1024等.

这篇关于与使用Quads的网格相比,Three.js加载已被三角剖分的网格是否更有性能?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆