Blazor: незначительные пробелы, обрезанные из компонентов во время компиляции

Статья
10/04/2023

Начиная с ASP.NET Core 5.0 компилятор Razor пропускает незначительное пробелы в компонентах Razor (razor-файлы ) во время компиляции. Обсуждение этого вопроса см. на странице dotnet/aspnetcore#23568.

Представленные версии

5,0

Старое поведение

В Blazor Server и Blazor WebAssembly версий 3.x символы пробела учитываются в исходном коде компонента. Текстовые узлы, состоящие только из пробелов, отображаются в модели DOM браузера даже при отсутствии визуального эффекта.

Рассмотрим следующий код компонента Razor:

<ul>
    @foreach (var item in Items)
    {
        <li>
            @item.Text
        </li>
    }
</ul>

В предыдущем примере отображаются два узла пробелов:

за пределами блока кода @foreach;
вокруг элемента <li>;
вокруг выходных данных @item.Text.

Список, содержащий 100 элементов, формирует 402 узла пробелов. Это более половины всех отображаемых узлов, хотя ни один из узлов пробелов не влияет на отображаемые выходные данные.

При отрисовке статического HTML для компонентов пробелы внутри тега не сохраняются. Например, просмотрите исходный код следующего компонента:

<foo        bar="baz"     />

Пробел не сохраняется. Предварительно преобразованные для просмотра выходные данные имеют следующий вид:

<foo bar="baz" />

Новое поведение

Если директива @preservewhitespace не используется со значением true, узлы пробелов удаляются в следующих случаях:

они находятся в начале или конце элемента;
они находятся в начале или конце параметра RenderFragment. Например, дочернее содержимое передается другому компоненту.
они находятся в начале или конце блока кода C#, например @if и @foreach.

Причина изменения

Платформа Blazor в ASP.NET Core 5.0 предназначена для повышения производительности визуализации и сравнения. Узлам дерева незначащих пробелов требовалось до 40 процентов времени отрисовки в тестах производительности.

Затронутые API

Нет

Поделиться через