fix(module:icon): debounce icon rendering on animation frame

[arturovt]

Closes #7825

[zorro-bot]

This preview will be available after the AzureCI is passed.

[codecov]

Codecov Report

Attention: Patch coverage is 92.85714% with 1 line in your changes missing coverage. Please review.

Project coverage is 92.06%. Comparing base (bf2b33b) to head (615edbf).
Report is 1 commits behind head on master.

Files with missing lines	Patch %	Lines
components/icon/icon.directive.ts	92.85%	0 Missing and 1 partial ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #8579      +/-   ##
==========================================
- Coverage   92.06%   92.06%   -0.01%     
==========================================
  Files         560      560              
  Lines       19621    19625       +4     
  Branches     3098     3099       +1     
==========================================
+ Hits        18064    18067       +3     
  Misses       1218     1218              
- Partials      339      340       +1     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[HyperLife1119]

LGTM

[Copilot]

Pull Request Overview

This PR debounces icon rendering on animation frames to improve performance when many icons are rendered, integrates PendingTasks for SSR hydration, and centralizes zone handling.

• Debounce icon rendering with animationFrameScheduler on browser and asapScheduler on server.
• Inject and use PendingTasks to register hydration tasks and finalize them correctly.
• Move zone boundaries: invoke changeIcon2 outside Angular in ngOnChanges.

Comments suppressed due to low confidence (4)

components/icon/icon.directive.ts:133

• There are no tests covering the new debounce behavior in browser vs. server environments. Please add unit tests to verify debouncing works as intended and tasks are finalized correctly.

      debounceTime(0, this.isBrowser ? animationFrameScheduler : asapScheduler),

components/icon/icon.directive.ts:127

• [nitpick] The name removeTask is vague. Consider renaming to something like removePendingTask to clarify that this callback unregisters a pending hydration task.

    const removeTask = this.pendingTasks.add();

components/icon/icon.directive.ts:139

• [nitpick] The parameter svgOrRemove is ambiguous. Rename it to svgElement or renderedSvg for clarity on what the callback receives.

      next: svgOrRemove => {

components/icon/icon.directive.ts:122

• The method changeIcon2 assumes it runs outside Angular but only ngOnChanges wraps it in runOutsideAngular. If changeIcon2 is called elsewhere, it might trigger unwanted change detection. Consider moving runOutsideAngular inside changeIcon2 for consistency.

  private changeIcon2(): void {

[Laffery]

LGTM

[Laffery]

@arturovt please rebase to resolve conflicts