Html 类型3流体f:for速度非常慢

在我的Typo3扩展中，我使用了一个

addClassForSliding（“{mycarouseld}”）；
函数addClassForSliding（myCarouselID）{
$（“#myCarousel”+mycarouseld）.addClass（“isCarousel”）；
if（！$（“div.videoSlide”）.find（“div”）.hasClass（“这是唯一的幻灯片和幻灯片”））{
$（“#myCarousel”+myCarouselID）.addClass（“这是唯一的滑翔机滑翔机”）；
}
}

确保缓存已启用-如果未启用，请不要根据未缓存的渲染来判断性能

尽量避免使用多种情况。而且绝对不要像

那样留下空节点

将您在上一次迭代中所做的工作移动到循环之外（从而节省了另一个条件和大量节点构造）

尽可能避免使用

迭代

变量。它向每个迭代添加额外的处理和变量赋值

我假设您使用JS来激活组件。因此，使用JS设置

活动的
CSS类，从而避免1）像您这样错误地打开和关闭标记，以及2）避免另一个只在一次中为真的条件，如另一个条件

请检查渲染的部分图像。它可能无法编译。每次渲染时，都必须解决部分问题。注意：在这种类型的用例中，一个部分几乎总是比一个部分好。我编写的一个工具，您可以使用它预编译模板，如果任何模板不兼容，它可能会失败：

一般来说：除非有非常好的理由，否则不要在流体中输出

。尽可能从外部加载脚本并存储脚本需要的值，例如

data-

properties。更快的解析，更快的循环

使用实际的分析工具精确定位瓶颈。您的代码使用ViewHelper，并且对配置也很敏感，例如，您对路径等的设置越多。在

f:render

调用中需要进行的处理越多。不要在开发环境中配置文件

不要在Docker设置中配置文件-除非您正在运行Linux。即使如此，也要对结果有所保留：文件系统性能永远不会相等

避免

迭代

和您的条件，并将最后一个块移到循环之外，应该会减少80%的成本（不包括您渲染的部分中发生的情况-这可能会在性能上非常糟糕，我们永远也不知道，因为您没有粘贴该块）

最后，当选择是否呈现一个部分或一个部分时，有两件事情需要考虑。其中大部分完全取决于您的用例（例如：您需要如何构造模板-您可以覆盖的部分比您不能覆盖的部分更有意义吗？）

• 渲染存在于同一模板中的节时，只需调用一个函数，即可使用一组新的模板变量切换到该节
• 但在渲染部分时，必须先解析该部分的模板文件，然后才能进行渲染
• 由于同一个已编译模板必须能够在多个不同的上下文中呈现，因此无法编译已解析的模板
• 因此，对部分模板的解析可能只在每个上下文中缓存一次，这意味着如果同一模板在一个页面上的多个上下文中多次呈现，则与使用节（编译为普通函数调用）相比，性能可能会受到很大影响
• 模板路径越多，文件解析就越困难

您始终需要为任务选择正确的工具—这是我们作为开发人员的工作之一—因此这些要点非常通用。有些用例在节和部分之间的性能没有差别，有些用例在使用

迭代时不会受到明显的影响；这完全取决于设置要求和渲染的数据。分析模板当然有助于找到正确的解决方案，因此我强烈建议您这样做

确保缓存已启用-如果未启用，请不要根据未缓存的渲染来判断性能
尽量避免使用多种情况。而且绝对不要像
那样留下空节点
将您在上一次迭代中所做的工作移动到循环之外（从而节省了另一个条件和大量节点构造）
尽可能避免使用
迭代
变量。它向每个迭代添加额外的处理和变量赋值
我假设您使用JS来激活组件。因此，使用JS设置
活动的
CSS类，从而避免1）像您这样错误地打开和关闭标记，以及2）避免另一个只在一次中为真的条件，如另一个条件

请检查渲染的部分图像。它可能无法编译。每次渲染时，都必须解决部分问题。注意：在这种类型的用例中，一个部分几乎总是比一个部分好。我写的一个工具，你可以使用，它也是预编译
<f:if condition="{videos -> f:count()} > 4">
    <f:then>
        <f:for each="{videos}" as="video" iteration="i">
            <f:if condition="{i.isFirst}">
                <f:then>
                    <div class="item active">
                </f:then>
                <f:else>
                    <div class="item">
                </f:else>
            </f:if>
            <div class="col-lg-3 thumbnailParent">
                <f:link.action controller="FrontendVideo" action="show" arguments="{video : video}">
                    <f:render partial="Video/ShowThumbnail" arguments="{video : video, userAuthorization : userAuthorization}"/>
                </f:link.action>
            </div>
            <!-- adding slider-class to one of all slides. condition: slide must have more than 4 videos for slide-effect -->
            <f:if condition="{i.isLast}">
                <f:then>
                    <script type="text/javascript">
                        addClassForSliding('{myCarouselID}');
                        function addClassForSliding(myCarouselID) {
                            $("#myCarousel"+myCarouselID).addClass("isCarousel");
                            if(!$("div.videoSlide").find("div").hasClass("thisIsTheOnlySliderWhichSlides")){
                                $("#myCarousel"+myCarouselID).addClass("thisIsTheOnlySliderWhichSlides");
                            }
                        }
                    </script>
                </f:then>
                <f:else></f:else>
            </f:if>
            </div>
        </f:for>
    </f:then>
    <f:else>
        <f:for each="{videos}" as="video" iteration="i">
            <div class="item active">
                <div class="col-lg-3">
                    <f:link.action controller="FrontendVideo" action="show" arguments="{video : video}">
                        <f:render partial="Video/ShowThumbnail" arguments="{video : video, userAuthorization : userAuthorization}"/>
                    </f:link.action>
                </div>
            </div>
        </f:for>
    </f:else>
</f:if>