958831: Update Ug for SEO hotfix

blazor-toc.html

@@ -248,6 +248,16 @@
 			<li>
 				<a href="/blazor/common/state-persistance">State Persistence</a>
 			</li>
+			<li>AOT Compilation
+				<ul>
+					<li>
+                       <a href="/blazor/common/aot-compilation/optimize-performance-blazor-wasm">Optimize Blazor WASM Performance</a>
+					</li>
+					<li>
+                        <a href="/blazor/common/aot-compilation/reduce-size-of-blazor-wasm">Reduce Size of WASM</a>
+					</li>
+				</ul>
+			</li>
 			<li>
 				<a href="/blazor/common/animation">Animation</a>
 			</li>
@@ -3718,6 +3728,7 @@
 					<li><a href="/blazor/pdfviewer-2/annotation/measurement-annotation">Measurement Annotations</a></li>
 					<li><a href="/blazor/pdfviewer-2/annotation/free-text-annotation">Free Text Annotations</a></li>
 					<li><a href="/blazor/pdfviewer-2/annotation/ink-annotation">Ink Annotation</a></li>
+					<li><a href="/blazor/pdfviewer-2/annotation/redaction-annotation">Redaction Annotations</a></li>
 					<li><a href="/blazor/pdfviewer-2/annotation/comments">Comments</a></li>
 					<li><a href="/blazor/pdfviewer-2/annotation/import-export-annotation">Import and Export Annotations</a></li>
 					<li><a href="/blazor/pdfviewer-2/annotation/annotations-in-mobile-view">Annotations in Mobile View</a></li>
@@ -4323,6 +4334,7 @@
 			</li>
 			<li><a href="/blazor/smart-paste/annotation">Annotation</a></li>
 			<li><a href="/blazor/smart-paste/customization">Style and Appearance</a></li>
+			<li><a href="/blazor/smart-paste/custom-inference-backend">Custom AI Service</a></li>
 		</ul>
 	</li>
 	<li>Smart TextArea
@@ -4337,6 +4349,7 @@
 			</li>
 			<li><a href="/blazor/smart-textarea/customization">Customize Suggestions</a></li>
 			<li><a href="/blazor/smart-textarea/features">Inherited Features</a></li>
+			<li><a href="/blazor/smart-textarea/custom-inference-backend">Custom AI Service</a></li>
 		</ul>
 	</li>
 	<li>Smith Chart

blazor/common/aot-compilation/optimize-performance-blazor-wasm.md

@@ -0,0 +1,107 @@
+---
+layout: post
+title: Optimize Performance in Blazor WASM using AOT Compilation - Syncfusion
+description: Check out the documentation for Optimize Performance using AOT Compilation in Blazor WebAssembly in Blazor
+platform: Blazor
+component: Common
+documentation: ug
+---
+
+# Optimize Performance in Blazor WebAssembly using AOT Compilation
+
+This article explains how to improve the performance of **Blazor WebAssembly (WASM)** applications using **Ahead-of-Time (AOT) compilation**, specifically for applications using **Syncfusion Blazor components**.
+
+## AOT Compilation Overview
+
+Blazor WebAssembly applications run entirely in the browser via WebAssembly. By default, the app’s .NET assemblies are downloaded and executed using a **Just-In-Time (JIT)** interpreter. However, enabling **AOT compilation** ahead of time converts the .NET Intermediate Language (IL) into native WebAssembly at build time, resulting in significant performance gains.
+
+## Enable AOT Compilation
+
+Follow the steps below to configure AOT for your Blazor WASM project.
+
+### Step 1: Target .NET 8+
+
+Ensure your project targets .NET 8 or later:
+
+```xml
+<TargetFramework>net8.0</TargetFramework>
+```
+
+### Step 2: Enable AOT in your project file
+
+Add the following to your `.csproj` file:
+
+```xml
+<PropertyGroup>
+  <RunAOTCompilation>true</RunAOTCompilation>
+</PropertyGroup>
+```
+
+Then publish the project using:
+
+{% tabs %}
+{% highlight c# tabtitle="Blazor publish App" %}
+
+dotnet publish -c Release
+
+{% endhighlight %}
+{% endtabs %}
+
+The output will be located in:
+
+{% tabs %}
+{% highlight c# tabtitle="Blazor publish App Location" %}
+
+bin/Release/net8.0/publish/wwwroot/
+
+{% endhighlight %}
+{% endtabs %}
+
+> AOT improves performance but increases WASM size (~1.5–2×). Use Brotli compression and proper caching to minimize impact.
+
+---
+
+## Size vs Performance Tradeoff
+The following table compares performance and size metrics for Blazor WebAssembly with and without AOT, using a Syncfusion Grid with paging enabled.
+
+| Metric                     | Without AOT          | With AOT             |
+|----------------------------|----------------------|----------------------|
+| Initial Load Time          | ~3.90 seconds        | ~3.04 seconds        |
+| On Page Refresh            | ~71 ms               | ~61 ms               |
+| Bundle Size (Brotli)       | ~114 MB              | ~192 MB              |
+| Memory Usage               | Slightly lower       | Slightly higher      |
+
+> [AOT compilation](https://learn.microsoft.com/en-us/aspnet/core/blazor/webassembly-build-tools-and-aot?view=aspnetcore-9.0#ahead-of-time-aot-compilation) increases the application size but significantly improves load time, interactivity and overall runtime performance in Blazor WebAssembly applications.
+
+---
+
+## Limitations
+
+- **Longer Build Time:** AOT compilation is slower compared to standard builds.
+- **Increased Bundle Size:** Final WebAssembly size is larger.
+- **Higher Memory Usage:** While AOT improves performance, it may result in slightly higher memory usage at runtime due to native code execution.
+- **Reduced Flexibility:** Dynamic features (e.g., reflection) may require additional handling.
+- **More Complex Debugging:** Source map support is limited.
+- **Slower Iterations:** Any code change needs full rebuild, affecting dev productivity.
+
+---
+
+## Considerations
+
+- **Better Performance:** Native WebAssembly improves execution speed and UI responsiveness.
+- **Enhanced Security:** Native code is harder to reverse-engineer than Intermediate Language code.
+- **Cross-Platform Consistency:** Consistent behavior across browsers and devices.
+
+---
+
+## Specific Recommendations
+
+To further reduce published output size, [enable linker and trimming](https://learn.microsoft.com/en-us/dotnet/core/deploying/trimming/trimming-options#enable-trimming) options in your `.csproj`:
+
+```xml
+<PublishTrimmed>true</PublishTrimmed>
+<InvariantGlobalization>true</InvariantGlobalization>
+<BlazorWebAssemblyEnableLinking>true</BlazorWebAssemblyEnableLinking>
+```
+
+> **InvariantGlobalization** reduces globalization data. Only use this if your app doesn't rely on specific culture or regional formats.

blazor/common/aot-compilation/reduce-size-of-blazor-wasm.md

@@ -0,0 +1,125 @@
+---
+layout: post
+title: Reduce Size of Blazor WebAssembly Application - Syncfusion
+description: Check out the documentation for reduce size of blazor webassembly application in blazor using various techniques
+platform: Blazor
+component: Common
+documentation: ug
+---
+
+# Reduce Size of Blazor WebAssembly Application
+
+This article explains how to reduce the size of **Blazor WebAssembly (WASM)** applications. Although [Ahead-of-Time (AOT)](https://learn.microsoft.com/en-us/aspnet/core/blazor/webassembly-build-tools-and-aot?view=aspnetcore-9.0#ahead-of-time-aot-compilation) compilation improves performance, it also increases the app size. To help reduce this, you can enable code trimming options in our projects. Trimming automatically removes unused code from the final output, which helps lower the bundle size without affecting functionality. This is especially helpful when using large projects.
+
+## Configure the Linker for ASP.NET Core Blazor
+
+Blazor WebAssembly uses [Intermediate Language (IL) linking](https://learn.microsoft.com/en-us/aspnet/core/blazor/webassembly-build-tools-and-aot?view=aspnetcore-9.0#trim-net-il-after-ahead-of-time-aot-compilation) to trim unused code from the final output during build. This process is **only enabled in Release builds** and is **disabled in Debug configuration** by default. To take full advantage of trimming and reduce the size of the published application, it is recommended to **build your app in Release mode** before deployment.
+
+> Always publish your Blazor WebAssembly app using the `Release` configuration to enable trimming and optimize performance.
+
+### Disable Intermediate Language Linking (Optional)
+
+To manually disable Intermediate Language linking, add the following MSBuild property in your `.csproj` file:
+
+```xml
+<PropertyGroup>
+  <BlazorWebAssemblyEnableLinking>false</BlazorWebAssemblyEnableLinking>
+</PropertyGroup>
+```
+## Enable trimming
+
+**PublishTrimmed** property enables code trimming for self-contained publishing.It automatically disables features that aren’t compatible with trimming and provides warnings about trimming conflicts during build.
+
+To [enable trimming](https://learn.microsoft.com/en-us/dotnet/core/deploying/trimming/trimming-options#enable-trimming), add the following to your `.csproj` file:
+
+```xml
+<PropertyGroup>
+  <PublishTrimmed>true</PublishTrimmed>
+</PropertyGroup>
+```
+
+## Trim mode
+
+For all assemblies in a Blazor application, trimming is enabled by default from the.NET 8 target framework. Trim warnings may cause problems for applications that have previously used `PublishTrimmed=true` and `TrimMode=partial`. However, if your application compiles without any trim warnings, this default behavior shouldn't interfere with functionality or cause issues. For more information, refer to the [trim configuration](https://learn.microsoft.com/en-us/aspnet/core/blazor/host-and-deploy/configure-trimmer?view=aspnetcore-9.0) documentation to achieve this.
+
+### To Resolve trim warnings
+
+Partial trimming is less aggressive and may be safer for applications that use reflection. To ensure smooth builds, resolve all trim warnings in our application, make the below changes in our `.csproj` to resolve the trim warnings
+
+```xml
+<TrimMode>partial</TrimMode>
+```
+
+## Enable Link Trimming 
+
+To control **Intermediate Language (IL)** trimming on a per-assembly basis by supplying an XML configuration file. This approach allows you to explicitly preserve assemblies, types, or members that may be trimmed, even if they are not directly referenced in your application code.
+
+To [enable Intermediate Language trimming](https://learn.microsoft.com/en-us/dotnet/core/deploying/trimming/prepare-libraries-for-trimming#enable-project-specific-trimming) in a Syncfusion Blazor application, update the project file as shown below. This example demonstrates how to safely configure trimming using the Grid paging feature.
+
+#### How to Enable Intermediate Language Trimming Safely for Syncfusion Blazor Grid
+
+1. Modify your project file (.csproj) to include trimmable assemblies and descriptors:
+  ```xml
+    <ItemGroup>
+      <TrimmableAssembly Include="Syncfusion.Blazor" />
+      <TrimmerRootDescriptor Include="SyncfusionRoots.xml" />
+      <BlazorLinkerDescriptor Include="LinkerConfig.xml" />
+    </ItemGroup>
+  ```
+2. Create the SyncfusionRoots.xml file in your project root with content like:
+
+  ```xml
+  <linker>
+    <!-- Preserve methods and types if needed -->
+    <assembly fullname="Syncfusion.Blazor.Buttons" />
+    <assembly fullname="Syncfusion.Blazor.Core" />
+    <assembly fullname="Syncfusion.Blazor.Calendars" />
+    <assembly fullname="Syncfusion.Blazor.Data" />
+    <assembly fullname="Syncfusion.Blazor.DropDowns" />
+    <assembly fullname="Syncfusion.Blazor.Inputs" />
+    <assembly fullname="Syncfusion.Blazor.Navigations" />
+    <assembly fullname="Syncfusion.Blazor.Spinner" />
+    <assembly fullname="Syncfusion.Blazor.Grids" >
+      <type fullname="Syncfusion.Blazor.Grids.GridColumn" />
+      <type fullname="Syncfusion.Blazor.Grids.GridFilterSettings" />
+      <type fullname="Syncfusion.Blazor.Grids.SortColumn" />
+      <type fullname="Syncfusion.Blazor.Grids.GridSortSettings" />
+      <type fullname="Syncfusion.Blazor.Grids.GridSelectionSettings" />
+      <type fullname="Syncfusion.Blazor.Grids.GridEditSettings" />
+      <type fullname="Syncfusion.Blazor.Grids.GridTextWrapSettings" />
+      <type fullname="Syncfusion.Blazor.Grids.GroupingEventArgs" />
+      <type fullname="Syncfusion.Blazor.Grids.GroupedEventArgs" />
+      <type fullname="Syncfusion.Blazor.Grids.GridSearchSettings" />
+      <type fullname="Syncfusion.Blazor.Grids.GridRowDropSettings" />
+    </assembly>
+    <assembly fullname="Syncfusion.Blazor.Data">
+      <type fullname="Syncfusion.Blazor.Data.ColumnFilter" />
+      <type fullname="Syncfusion.Blazor.Data.FilterBehavior" />
+      <type fullname="Syncfusion.Blazor.Data.DataUtil" />
+      <type fullname="Syncfusion.Blazor.Data.GraphQLAdaptor" />
+      <type fullname="Syncfusion.Blazor.Data.GraphQLAdaptorOptions" />
+      <type fullname="Syncfusion.Blazor.Data.GraphQLMutation" />
+      <type fullname="Syncfusion.Blazor.Data.QueryableOperation" />
+      <type fullname="Syncfusion.Blazor.Data.SortDescriptionIndex" />
+      <type fullname="Syncfusion.Blazor.Data.SortedColumn" />
+      <type fullname="Syncfusion.Blazor.Data.ValueConvert" />
+      <type fullname="Syncfusion.Blazor.Data.WhereFilter" />
+     </assembly>
+  </linker>
+  ```
+3. Prevent Trimming of .NET Core Runtime Types. If your app uses reflection, LINQ expressions, or dynamic operations, consider including a LinkerConfig.xml to preserve critical system libraries. It is completely optional.
+
+  ```xml
+    <ItemGroup>
+      <BlazorLinkerDescriptor Include="LinkerConfig.xml" />
+    </ItemGroup>
+  ```
+
+### Final Evaluation
+
+To evaluate application size, a Blazor WebAssembly test application was configured with Syncfusion components, specifically featuring the Blazor Grid with paging enabled.
+
+|   AOT Status          | With Trim            | Without Trim         |
+|-----------------------|----------------------|----------------------|
+|   Disable             |     23 MB            |    26 MB             |
+|   Enable              |     55 MB            |    59 MB             |

blazor/common/content-security-policy.md

@@ -16,7 +16,7 @@ When enabling strict Content Security Policy (CSP), some browser features are di
 To use Syncfusion<sup style="font-size:70%">&reg;</sup> blazor components with strict CSP mode, the following directives must be included in the CSP meta tag:
 
 * `font-src data:` - This directive allows for the use of `base64` encoded font icons.
-* `style-src 'self' unsafe-inline` - This directive permits the use of inline styles, allowing components to apply parameters such as Width, Height, positioning, etc. Additionally, certain [components](#components-utilizing-inline-style-for-functionality) depend on inline styling to render interactive behaviors and complex layouts effectively.
+* `style-src 'self' unsafe-inline` - This directive permits the use of inline styles, allowing components to apply parameters such as Width, Height, positioning, etc. Additionally, certain components depend on inline styling to render dynamic behaviors and responsive UI design.
 * `connect-src 'self' https: wss:` - This directive enables web sockets.
 * `script-src 'self' unsafe-eval` - This directive allows for the use of the `new()` and `eval()` functions. Used in animation enabled Syncfusion<sup style="font-size:70%">&reg;</sup> components.
 
@@ -72,38 +72,6 @@ if you are referencing script and style references from CDN, then add CDN domain
 {% endhighlight %}
 {% endtabs %}
 
-## Components Utilizing Inline Style for Functionality
-
-Some Syncfusion components use inline styles to achieve responsive layouts, precise positioning, dynamic sizing, and visual behaviors essential to their functionality. The table below lists components that depend on inline styles, along with the properties or features that require them.
-
-| Component                | Properties/Functionalities Requiring Inline Styles                                                                 |
-|--------------------------|---------------------------------------------------------------------------------------------------------------------|
-| 3D Charts, TreeMap, Charts, ProgressBar, Circular Gauge, HeatMap Chart, LinaerGauge, Maps, Bullet Chart, ImageEditor, RangeSlider, Sankey, SmithChart, SparklineChart, Stock Chart                | Appearance customization, layout, and rendering.|
-| Accordion, Tabs, Toolbar, Kanban, Carousel, Toast, Skeleton, Splitter                 | Height and Width.|
-| DatePicker, DateTime Picker, DateRange Picker, In-place Editor, Input Mask, ListBox, MultiSelect Dropdown, Numeric TextBox, Query Builder, TextArea, TextBox, TimePicker                 | Width|
-| Dashboard Layout         | Panel height, gridline styles.|
-| Sidebar                  | Width and transform in normal and docker mode.|
-| Stepper                  | Width and transform.|
-| Dialog                   | Z-index, height, and width.|
-| AutoComplete             | Width, PopupHeight, and PopupWidth.|
-| Pivot Table              | Grouping bar layout, conditional formatting dialog, height and width of pivot chart and pager, cell positioning.|
-| Rich Text Editor         | Height, width, font styling, toolbar styling.|
-| Gantt Chart              | Taskbar Dimensions, Chart Row Layout, Timeline and Header Layout, Label Containers and Connectors, Progress Bars and Segments, Baseline and Connector Styling, Virtualization Elements.|
-| Context Menu, Menu Bar             | Menu popup visibility.|
-| Scheduler                | Agenda view, resource headers, appointment styling, tooltip—positioning and colors.|
-| Dropdown List            | Width, PopupHeight, PopupWidth|
-| Mention                  | PopupHeight and popup visibility.|
-| MultiColumn ComboBox     | Width, PopupHeight, PopupWidth, Z-Index|
-| Progress Button          | Spinner theme CSS|
-| Rating                   | Rating fill value.|
-| Spinner                  | Z-index and styling from spinner CSS theme|
-| ColorPicker              | Color|
-| ComboBox                 | Width, PopupHeight, and PopupWidth.|
-| DataForm                 | Width, ColumnSpacing.|
-| SpeedDial                | Speed dial animation and layout styles|
-| Ribbon                   | filemenu and helpTemplate width for ribbon tab. |
-
-
 ## See also
 
-* [Content Security Policy for ASP.NET Core Blazor](https://learn.microsoft.com/en-us/aspnet/core/blazor/security/content-security-policy?view=aspnetcore-7.0)
+* [Content Security Policy for ASP.NET Core Blazor](https://learn.microsoft.com/en-us/aspnet/core/blazor/security/content-security-policy?view=aspnetcore-9.0)