#78 Angularの最新情報がわかる！Monthly Angular 4月号

[lacolaco]

YouTube: https://www.youtube.com/watch?v=Pq8PebgdYLo
connpass: https://ngjapan.connpass.com/event/317375/

[lacolaco]

アジェンダ

• Angular v18 先取り
• Event Dispatch (JSAction)
• Zoneless

[lacolaco]

Angular v18 先取り

https://github.com/angular/angular/blob/main/CHANGELOG.md

ng-content fallback content

• feat(core): add support for fallback content in ng-content by crisbeto · Pull Request #54854 · angular/angular

router update

• feat(router): Add ability to return UrlTree with `NavigationBehaviorOptions` from guards by atscott · Pull Request #45023 · angular/angular
• feat(router): Allow Route.redirectTo to be a function which returns a… by atscott · Pull Request #52606 · angular/angular
• Resolvers can return redirect command by atscott · Pull Request #54556 · angular/angular
• feat(router): `withNavigationErrorHandler` can convert errors to redi… · angular/angular@4a42961

i18n hydration developer preview

• feat(platform-browser): add withI18nSupport() in developer preview by devknoll · Pull Request #55130 · angular/angular
• feat(core): add support for i18n hydration by devknoll · Pull Request #54823 · angular/angular

event dispatch

• feat(core): Add event delegation library to queue up events and… by iteriani · Pull Request #55121 · angular/angular
• feat(core): Add a public API to establish events to be replayed and a… by iteriani · Pull Request #55356 · angular/angular

zoneless

• feat(core): Add zoneless change detection provider as experimental by atscott · Pull Request #55329 · angular/angular
• feat(core): Add ability to configure zone change detection to use zon… by atscott · Pull Request #55252 · angular/angular
• Add zoneless scheduler to Angular by default by atscott · Pull Request #55102 · angular/angular

forms

• feat(forms): Unified Control State Change Events by JeanMeche · Pull Request #54579 · angular/angular

migrations

• feat(migrations): Migration schematics for `HttpClientModule` (#54020) · angular/angular@f914f6a

その他

• feat(core): provide ExperimentalPendingTasks API by pkozlowski-opensource · Pull Request #55487 · angular/angular

[lacolaco]

Event Dispatch (JSAction)

Event Dispatch in Angular. Authors: Jatin Ramanathan, Tom… | by Angular | Apr, 2024 | Angular Blog

One issue with full application hydration is that your page may look interactive before hydration has happened.

Integrating Event Dispatch is a key first step towards finer-grained hydration. With Event Dispatch we stop dropping events that trigger before hydration. However, we still need to wait for hydration to finish to respond to the events. In order to minimize this wait time we need to decrease the amount of JavaScript that is in the critical path of hydration. We plan to do this by lazily hydrating Deferrable Views that are rendered on the server. Stay tuned for more exciting updates in server side rendering!

[lacolaco]

Zoneless

Navigating the New Era of Angular: Zoneless Change Detection Unveiled | by Netanel Basal | Netanel Basal

• feat(core): Add zoneless change detection provider as experimental angular/angular#55329
  • provideExperimentalZonelessChangeDetection() の追加
  • NgZone が作成されなくなる

   * - calling `ChangeDetectorRef.markForCheck`
   * - calling `ComponentRef.setInput`
   * - updating a signal that is read in a template
   * - when bound host or template listeners are triggered
   * - attaching a view that is marked dirty
   * - removing a view

• feat(core): Add ability to configure zone change detection to use zon… angular/angular#55252
• Add zoneless scheduler to Angular by default angular/angular#55102
  • Zone-based app向けの設定
  • ignoreChangesOutsideZone オプションの追加 (BootstrapOptions と NgZoneOptions)
    • false (v18からのデフォルト): NgZoneの外のトリガーを無視しない
    • true: v17までの挙動