From 0f734b75bb3accc798f1e68b8e097d5667e69c4d Mon Sep 17 00:00:00 2001 From: Maya Kirova Date: Mon, 30 Jun 2025 13:52:53 +0300 Subject: [PATCH 1/2] Add section on performance impact of different blazor templates. --- .../grids/_shared/virtualization.md | 40 +++++++++++++++++++ 1 file changed, 40 insertions(+) diff --git a/doc/en/components/grids/_shared/virtualization.md b/doc/en/components/grids/_shared/virtualization.md index 5fe02b2e8..cd865a513 100644 --- a/doc/en/components/grids/_shared/virtualization.md +++ b/doc/en/components/grids/_shared/virtualization.md @@ -43,6 +43,46 @@ The `{ComponentName}` supports remote virtualization, which is demonstrated in t + + +## Templating + +When needing to customize one of the existing templates in the grid, Blazor provides two possible ways to define a template: + +- via a server-side template, using the related component property (i.e. `BodyTemplate` property) or declaratively with the template name. For example: + +``` + + + Template content here + + +``` + +This will render the template after first requesting and resolving it from the server. + +- via a client-template using the `Script` equivalent of the property (i.e. `BodyTemplateScript`) to set it to the name of the client-side function handler, for example: + +``` + + +``` + +``` +igRegisterScript("CellTemplate", (ctx) => { + var html = window.igTemplating.html; + return html`Template content here`; +}, false); + +``` + +The handler then renders the provided lit template directly in the DOM as needed. + +> [!Note] +> While both approaches are valid, the server-side templates do require a round-trip request to the server to retrieve and resolve the custom template before rendering it on the client. As such the client-template approach is more optimized and recommended, especially in scenarios with many templates that need frequent updates as there may be a noticeable delay between the related user-interaction and the template updates. + + + ## Virtualization Limitations * On Mac OS horizontal scrollbar is not visible when "Show scrollbars only when scrolling" system option is set to true (which is the default value). This is because the `{ComponentName}`’s row container has an overflow set to hidden. Change the option to "Always" and the scrollbar will appear. From eded4ec173dd25a179068337d6961925d65aec7c Mon Sep 17 00:00:00 2001 From: Maya Kirova Date: Thu, 21 Aug 2025 13:24:44 +0300 Subject: [PATCH 2/2] chore(*): Set language identifier where possible. --- .../components/grids/_shared/virtualization.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/doc/en/components/grids/_shared/virtualization.md b/doc/en/components/grids/_shared/virtualization.md index cd865a513..e84bafb33 100644 --- a/doc/en/components/grids/_shared/virtualization.md +++ b/doc/en/components/grids/_shared/virtualization.md @@ -51,21 +51,21 @@ When needing to customize one of the existing templates in the grid, Blazor prov - via a server-side template, using the related component property (i.e. `BodyTemplate` property) or declaratively with the template name. For example: -``` - - - Template content here - - +```razor + + + Template content here + + ``` This will render the template after first requesting and resolving it from the server. - via a client-template using the `Script` equivalent of the property (i.e. `BodyTemplateScript`) to set it to the name of the client-side function handler, for example: -``` - - +```razor + + ``` ```