【韩剧app源码架设】【宝箱小程序源码】【神雕侠侣mytv源码】nth源码

时间:2024-12-26 02:21:50 编辑:Vulkan源码 来源:同城上门软件源码下载

1.游戏引擎随笔 0x36:UE5.x Nanite 源码解析之可编程光栅化(下)
2.R爬虫必备基础——CSS+SelectorGadget

nth源码

游戏引擎随笔 0x36:UE5.x Nanite 源码解析之可编程光栅化(下)

       书接上回。

       在展开正题之前,先做必要的铺垫,解释纳尼特(Nanite)技术方案中的Vertex Reuse Batch。纳尼特在软光栅路径实现机制中,将每个Cluster对应一组线程执行软光栅,韩剧app源码架设每ThreadGroup有个线程。在光栅化三角形时访问三角形顶点数据,但顶点索引范围可能覆盖整个Cluster的个顶点,因此需要在光栅化前完成Cluster顶点变换。纳尼特将变换后的顶点存储于Local Shared Memory(LDS)中,进行组内线程同步,确保所有顶点变换完成,光栅化计算时直接访问LDS,实现软光栅高性能。

       然而,在使用PDO(Masked)等像素可编程光栅化时,纳尼特遇到了性能问题。启用PDO或Mask时,可能需要读取Texture,根据读取的Texel决定像素光栅化深度或是否被Discard。读取纹理需计算uv坐标,而uv又需同时计算重心坐标,宝箱小程序源码增加指令数量,降低寄存器使用效率,影响Active Warps数量,降低延迟隐藏能力,导致整体性能下降。复杂材质指令进一步加剧问题。

       此外,当Cluster包含多种材质时,同一Cluster中的三角形被重复光栅化多次,尤其是材质仅覆盖少数三角形时,大量线程闲置,浪费GPU计算资源。

       为解决这些问题,纳尼特引入基于GPU SIMT/SIMD的Vertex Reuse Batch技术。技术思路如下:将每个Material对应的三角形再次分为每个为一组的Batch,每Batch对应一组线程,每个ThreadGroup有个线程,正好对应一个GPU Warp。利用Wave指令共享所有线程中的变换后的顶点数据,无需LDS,减少寄存器数量,增加Warp占用率,神雕侠侣mytv源码提升整体性能。

       Vertex Reuse Batch技术的启用条件由Shader中的NANITE_VERT_REUSE_BATCH宏控制。

       预处理阶段,纳尼特在离线时构建Vertex Reuse Batch,核心逻辑在NaniteEncode.cpp中的BuildVertReuseBatches函数。通过遍历Material Range,统计唯一顶点数和三角形数,达到顶点去重和优化性能的目标。

       最终,数据被写入FPackedCluster,根据材质数量选择直接或通过ClusterPageData存储Batch信息。Batch数据的Pack策略确保数据对齐和高效存储。

       理解Vertex Reuse Batch后,再来回顾Rasterizer Binning的数据:RasterizerBinData和RasterizerBinHeaders。在启用Vertex Reuse Batch时,这两者包含的是Batch相关数据,Visible Index实际指的是Batch Index,而Triangle Range则对应Batch的三角形数量。

       当Cluster不超过3个材质时,直接从FPackedCluster中的VertReuseBatchInfo成员读取每个材质对应的BatchCount。有了BatchCount,即可遍历所有Batch获取对应的口袋支点指标源码三角形数量。在Binning阶段的ExportRasterizerBin函数中,根据启用Vertex Reuse Batch的条件调整BatchCount,表示一个Cluster对应一个Batch。

       接下来,遍历所有Batch并将其对应的Cluster Index、Triangle Range依次写入到RasterizerBinData Buffer中。启用Vertex Reuse Batch时,通过DecodeVertReuseBatchInfo函数获取Batch对应的三角形数量。对于不超过3个材质的Cluster,DecodeVertReuseBatchInfo直接从Cluster的VertReuseBatchInfo中Unpack出Batch数据,否则从ClusterPageData中根据Batch Offset读取数据。

       在Binning阶段的AllocateRasterizerBinCluster中,还会填充Indirect Argument Buffer,将当前Cluster的Batch Count累加,用于硬件光栅化Indirect Draw的Instance参数以及软件光栅化Indirect Dispatch的ThreadGroup参数。这标志着接下来的光栅化Pass中,每个Instance和ThreadGroup对应一个Batch,以Batch为光栅化基本单位。

       终于来到了正题:光栅化。本文主要解析启用Vertex Reuse Batch时的软光栅源码,硬件光栅化与之差异不大,此处略过。抓网站源码在线此外,本文重点解析启用Vertex Reuse Batch时的光栅化源码,对于未启用部分,除可编程光栅化外,与原有固定光栅化版本差异不大,不再详细解释。

       CPU端针对硬/软光栅路径的Pass,分别遍历所有Raster Bin进行Indirect Draw/Dispatch。由于Binning阶段GPU中已准备好Draw/Dispatch参数,因此在Indirect Draw/Dispatch时只需设置每个Raster Bin对应的Argument Offset即可。

       由于可编程光栅化与材质耦合,导致每个Raster Bin对应的Shader不同,因此每个Raster Bin都需要设置各自的PSO。对于不使用可编程光栅化的Nanite Cluster,即固定光栅化,为不降低原有性能,在Shader中通过两个宏隔绝可编程和固定光栅化的执行路径。

       此外,Shader中还包括NANITE_VERT_REUSE_BATCH宏,实现软/硬光栅路径、Compute Pipeline、Graphics Pipeline、Mesh Shader、Primitive Shader与材质结合生成对应的Permutation。这部分代码冗长繁琐,不再详细列出讲解,建议自行阅读源码。

       GPU端软光栅入口函数依旧是MicropolyRasterize,线程组数量则根据是否启用Vertex Reuse Batch决定。

       首先判断是否使用Rasterizer Binning渲染标记,启用时根据VisibleIndex从Binning阶段生成的RasterizerBinHeaders和RasterizerBinData Buffer中获取对应的Cluster Index和光栅化三角形的起始范围。当启用Vertex Reuse Batch,这个范围是Batch而非Cluster对应的范围。

       在软光栅中,每线程计算任务分为三步。第一步利用Wave指令共享所有线程中的Vertex Attribute,线程数设置为Warp的Size,目前为,每个Lane变换一个顶点,最多变换个顶点。由于三角形往往共用顶点,直接根据LaneID访问顶点可能重复,为确保每个Warp中的每个Lane处理唯一的顶点,需要去重并返回当前Lane需要处理的唯一顶点索引,通过DeduplicateVertIndexes函数实现。同时返回当前Lane对应的三角形顶点索引,用于三角形设置和光栅化步骤。

       获得唯一顶点索引后,进行三角形设置。这里代码与之前基本一致,只是写成模板函数,将Sub Pixel放大倍数SubpixelSamples和是否背面剔除bBackFaceCull作为模板参数,通过使用HLSL 语法实现。

       最后是光栅化三角形写入像素。在Virtual Shadow Map等支持Nanite的场景下,定义模板结构TNaniteWritePixel来实现不同应用环境下Nanite光栅化Pipeline的细微差异。

       在ENABLE_EARLY_Z_TEST宏定义时,调用EarlyDepthTest函数提前剔除像素,减少后续重心坐标计算开销。当启用NANITE_PIXEL_PROGRAMMABLE宏时,可以使用此机制提前剔除像素。

       最后重点解析前面提到的DeduplicateVertIndexes函数。

       DeduplicateVertIndexes函数给每个Lane返回唯一的顶点索引,同时给当前Lane分配三角形顶点索引以及去重后的顶点数量。

       首先通过DecodeTriangleIndices获取Cluster Local的三角形顶点索引,启用Cluster约束时获取所有Lane中最小的顶点索引,即顶点基索引。将当前三角形顶点索引(Cluster Local)减去顶点基索引,得到相对顶点基索引的局部顶点索引。

       接下来生成顶点标志位集合。遍历三角形三个顶点,将局部顶点索引按顺序设置到对应位,表示哪些顶点已被使用。每个标志位是顶点的索引,并在已使用的顶点位置处设置为1。使用uint2数据类型,最多表示个顶点位。

       考虑Cluster最多有个顶点,为何使用位uint2来保存Vertex Mask而非位?这是由于Nanite在Build时启用了约束机制(宏NANITE_USE_CONSTRAINED_CLUSTERS),该机制保证了Cluster中的三角形顶点索引与当前最大值之差必然小于(宏CONSTRAINED_CLUSTER_CACHE_SIZE),因此,生成的Triangle Batch第一个索引与当前最大值之差将不小于,并且每个Batch最多有个唯一顶点,顶点索引差的最大值为,仅需2个位数据即可。约束机制确保使用更少数据和计算。

       将所有Lane所标记三个顶点的Vertex Mask进行位合并,得到当前Wave所有顶点位掩码。通过FindNthSetBit函数找出当前Lane对应的Mask索引,加上顶点基索引得到当前Lane对应的Cluster Local顶点索引。

       接下来获取当前Lane对应的三角形的Wave Local的三个顶点索引,用于后续通过Wave指令访问其他Lane中已经计算完成的顶点属性。通过MaskedBitCount函数根据Vertex Mask以及前面局部顶点索引通过前缀求和得到当前Lane对应的Vertex Wave Local Index。

       最后统计Vertex Mask所有位,返回总计有效的顶点数量。

       注意FindNthSetBit函数,实现Lane与顶点局部索引(减去顶点基索引)的映射,返回当前Lane对应的Vertex Mask中被设置为1的位索引。如果某位为0,则返回下一个位为1的索引。如果Mask中全部位都设置为1,则实际返回为Lane索引。通过二分法逐渐缩小寻找索引范围,不断更新所在位置,最后返回找到的位置索引。

       最后,出于验证目的进行了Vertex Reuse Batch的性能测试。在材质包含WPO、PDO或Mask时关闭Vertex Reuse Batch功能,与开启功能做对比。测试场景为由每颗万个三角形的树木组成的森林,使用Nsight Graphics进行Profiling,得到GPU统计数据如下:

       启用Vertex Reuse Batch后,软光栅总计耗时减少了1.毫秒。SM Warp总占用率有一定提升。SM内部工作量分布更加均匀,SM Launch的总Warp数量提升了一倍。长短板Stall略有增加,但由于完全消除了由于LDS同步导致的Barrier Stall,总体性能还是有很大幅度的提升。

       至此,Nanite可编程光栅化源码解析讲解完毕。回顾整个解析过程,可以发现UE5团队并未使用什么高深的黑科技,而是依靠引擎开发者强悍的工程实现能力完成的,尤其是在充分利用GPU SIMT/SIMD机制榨干机能的同时,保证了功能与极限性能的实现。这种能力和精神,都很值得我们学习。

R爬虫必备基础——CSS+SelectorGadget

        CSS,全称叫作Cascading Style Sheets,即层叠样式表。“层叠”是指当在HTML中引用了数个样式文件,并且样式发生冲突时,浏览器能依据层叠顺序处理。“样式”指网页中文字大小、颜色、元素间距、排列等格式。HTML定义了网页的结构,但是只有HTML页面的布局并不美观,可能只是简单的节点元素的排列,为了让网页看起来更好看一些,这里借助了CSS。CSS是目前唯一的网页页面排版样式标准,有了它的帮助,页面才会变得更为美观。如下图的右侧,即为CSS。

        就局部放大来看,下图所示就是一个CSS样式。大括号前面是一个CSS选择器,此选择器的意思是首先选中id为head_wrapper且class为s-ps-islite的节点,然后再选中其内部的class为s-p-top的节点。大括号内部写的就是一条条样式规则,例如position指定了这个元素的布局方式为绝对布局,bottom指定元素的下边距为像素,width指定了宽度为%占满父元素,height则指定了元素的高度。也就是说,我们将位置、宽度、高度等样式配置统一写成这样的形式,然后用大括号括起来,接着在开头再加上CSS选择器,这就代表这个样式对CSS选择器选中的元素生效,元素就会根据此样式来展示了。在网页中,一般会统一定义整个网页的样式规则,并写入CSS文件中(其后缀为css)。在HTML中,只需要用link标签即可引入写好的CSS文件,这样整个页面就会变得美观、优雅。

        在爬虫过程中都需要爬取目标的节点,我们知道网页由一个个节点组成,CSS选择器会根据不同的节点设置不同的样式规则,那什么是节点?又怎样来定位节点呢?下面围绕这两个问题进行介绍。

        在HTML中,所有标签定义的内容都是节点,它们构成了一个HTML DOM树。我们先看下什么是DOM,DOM是W3C(万维网联盟)的标准,其英文全称Document Object Model,即文档对象模型。它定义了访问HTML和XML文档的标准:W3C文档对象模型(DOM)是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。W3C DOM标准被分为如下3个不同的部分:

        核心DOM:针对任何结构化文档的标准模型。

XML DOM:针对XML文档的标准模型。

HTML DOM:针对HTML文档的标准模型。

        根据W3C的HTML DOM标准,HTML文档中的所有内容都是节点。整个文档是一个文档节点;每个HTML元素是元素节点;HTML元素内的文本是文本节点;每个HTML属性是属性节点;注释是注释节点。HTML DOM将HTML文档视作树结构,这种结构被称为节点树,如下图所示。

        节点树中的节点彼此拥有层级关系。我们常用父(parent)、子(child)和兄弟(sibling)等术语描述这些关系。父节点拥有子节点,同级的子节点被称为兄弟节点。在节点树中,顶端节点称为根(root)。除了根节点之外,每个节点都有父节点,同时可拥有任意数量的子节点或兄弟节点。下图展示了节点树以及节点之间的关系。

        在CSS中,我们使用CSS选择器来定位节点。例如,下图中div节点的id为container,那么就可以表示为#container,其中#开头代表选择id,其后紧跟id的名称。另外,如果我们想选择class为wrapper的节点,便可以使用.wrapper,这里以点(.)开头代表选择class,其后紧跟class的名称。另外,还有一种选择方式,那就是根据标签名筛选,例如想选择二级标题,直接用h2即可。这是最常用的3种表示,分别是根据id、class、标签名筛选,请牢记它们的写法。

        另外,CSS选择器还支持嵌套选择,各个选择器之间加上空格分隔开便可以代表嵌套关系,如#container .wrapper p则代表先选择id为container的节点,然后选中其内部的class为wrapper的节点,然后再进一步选中其内部的p节点。另外,如果不加空格,则代表并列关系,如div#container .wrapper p.text代表先选择id为container的div节点,然后选中其内部的class为wrapper的节点,再进一步选中其内部的class为text的p节点。这就是CSS选择器,其筛选功能还是非常强大的。另外,CSS选择器还有一些其他语法规则,具体如下表所示。

        但是,这样每次都要浪费部分时间去寻找定位点,这样既不很方便,也不高效,那么如何提高爬虫中这部分工作的效率呢?今天我给大家分享一个爬虫的利器,它就是:SelectorGadget 插件。

        point and click CSS selectors,强大的谷歌插件CSS生成器,有助于我们快速找到html的节点信息,它也支持Xpath表达式。Selector Gadget是一个开源的Chrome扩展程序,可以轻松地在复杂的网站上生成和选择CSS选择器。安装扩展程序后,转到任意页面并启动它。网站右下方会打开一个方框。单击您希望选择器匹配的页面元素(它将变为绿色)。然后SelectorGadget将为该元素生成一个最小的CSS选择器,并突出显示(黄色)选择器匹配的所有内容。现在单击突出显示的元素将其从选择器中删除(红色),或单击未突出显示的元素将其添加到选择器。通过这个选择和拒绝过程,SelectorGadget可以帮助您找到满足您需求的完美CSS选择器。

        首先需要安装一下这个神器。在谷歌浏览器中的应用商店里,搜索到SelectorGadget插件,点击“添加至Chrome”即可。如果不能打开Chrome应用商店,可以通过网上的其他途径获取该插件,之后再手动添加至谷歌浏览器即可。手动添加方法是:打开谷歌浏览器扩展程序,并开启开发者模式,将该插件拖拽到浏览器里,如果不成功,可以选择“加载已解压的扩展程序”,将该文件夹先压缩再解压添加进去。

        同时在页面栏上能看到红框处的SelectorGadget标志。

        咱们以 / 网页为例,首先点击网页上方的SelectorGadget,然后在网页下方弹出SelectorGadget框。接下来,咱们尝试一下如何使用?比如我们想定位“拆弹专家2”的节点,直接点击它,则会在框内显示其节点——.item-title(如下图)。绿色:单击希望选择器匹配的页面元素。黄色:生成的这个CSS选择器【.item-title】能匹配的所有内容,从下图可以发现该CSS选择器可以抓取哪些信息。当你把鼠标放到这些高亮的元素上时,会显示红色,代表要将其从选择器中删除;而单击未突出显示的元素将其添加到选择器。

        在实际构建CSS表达式过程中,需要搭配网页开发工具里的copy selector功能使用,非常方便。比如:定位抓取以下网页( /allmovies )红框内的所有电影名称信息。

        具体操作流程如下:在某一电影名称下右击——检查,定位到电影名称的网页源码处,然后右击—copy—copy selector,再打开SelectorGadget,在框内粘贴CSS表达式,按Enter键,发现在网页中准确定位出该电影名称。但我们需要定位所有的电影名称,在已有的CSS表达式【(body > div:nth-child(5) > div.inner-wrapper > div.inner-2col-main > div > ul > li:nth-child(1) > a > span.item-title)】上进行修改,这里可以发现【li:nth-child(1)】只选取了第一个,而我们所需选取所有,因此去掉后面的【(1)】即可。在具体实践中,如何修改还有有赖于小伙伴对网页结构和CSS语法的理解。最终,获取以上红框内电影名称的CSS选择器表达式为:【body > div:nth-child(5) > div.inner-wrapper > div.inner-2col-main > div > ul > li:nth-child > a > span.item-title】。在实际应用中,不同节点标签之间用空格分隔:【body div:nth-child(5) div.inner-wrapper div.inner-2col-main div ul li:nth-child a span.item-title】。

        但在SelectorGadget使用中,发现其构建的CSS表达式往往很复杂,大部分情况下其实也是可以自己构建CSS表达式的。构建CSS选择表达式的关键在于清楚整个网页结构,找到标签之间的属于关系、属性值属于哪个标签等,就可以比较快速的构建。而且浏览器很智能,鼠标在源码上的位置,可以在网页显示上呈现阴影,这个功能简直太香了。以上红框内所有电影名字的CSS表达式也可以表示为:【div.movlist ul li a span.item-title】

        然后用SelectorGadget验证,如下图,发现高亮选中的部分就是我想要定位的信息,说明这个CSS表达式正确。

        以上简单介绍了如何构建CSS表达式,在爬虫过程中定位抓取特定节点数据是非常重要的一步,有了这步才有下游的精准数据提取与清洗。希望本次教程能给有需要的小伙伴一点小小帮助!

        更多内容可关注公共号“YJY技能修炼”~~~

        往期回顾

        R爬虫在工作中的一点妙用

        R爬虫必备基础——HTML和CSS初识

        R爬虫必备基础——静态网页+动态网页

        R爬虫必备——rvest包的使用