Cad is ea Zone.js agus cad atá i gceist ag "zoneless" Angular?

Question

Accepted Answer

**Zone.js** is leabharlann a bhí in úsáid ag Angular go stairiúil chun fios a bheith aici **cathain a rith an bhreisiú-dhéanamh athrú**. Patches sí APIs asynchronous an bhrabhsálaí ionas gur féidir le Angular déanamh thúiscint go huathoibríoch ar aon imeacht a d'fhéadfadh staid a athrú. Bhaineann **zoneless** Angular an spleáchas seo, ag baint úsáide as signálacha agus fógairtí sainsoiléir ina háit.

## Cad a dhéanann Zone.js

```text
Zone.js monkey-patches async APIs: setTimeout, addEventListener, Promise,
XHR/fetch, etc. When any of them fires, Zone.js notifies Angular →
Angular runs change detection automatically.
```

Is é seo an "dhraíochta" taobh thiar na nuashonraithí uathoibríocha Angular: bhriseann tú maoin tar éis freagra HTTP nó clic, agus an tsúile a tharraingíonn suas — toisc go raibh Zone.js ráite ag Angular go raibh imeacht asynchronous críochnaithe.

```ts
// you write this, and the view updates automatically — thanks to Zone.js:
setTimeout(() => { this.message = "Updated"; }, 1000); // Zone.js triggers CD
```

## Míbhuntáistí Zone.js

```text
✗ Overhead — patches everything, and triggers CD broadly (checks the whole tree)
✗ ~100KB added to the bundle
✗ Imprecise — runs change detection even when nothing relevant changed
✗ Can be confusing with third-party code that runs outside Angular's zone
```

De bharr nach féidir le Zone.js a rá *cad* a bhris, déanann sí pas iomlán de bhreisiú-dhéanamh ar go leor imeachtaí — neamhéifeachtach do fheidhmchláir mhór.

## Angular zoneless (bunaithe ar shignálacha)

```ts
bootstrapApplication(AppComponent, {
  providers: [provideZonelessChangeDetection()], // no Zone.js
});
```

I mód zoneless, ní bhraitheann Angular ar APIs asynchronous patched. Ina ionad sin, déantar breisiú-dhéanamh a bhrostú **go soiléir** — go príomha trí **shignálacha** (a fhógraíonn do Angular go cruinn nuair a athraíonn a luach), móide an `async` pipe, imeachtaí, agus `markForCheck()`.

```ts
count = signal(0);
increment() { this.count.set(this.count() + 1); } // the signal tells Angular what changed → fine-grained update
```

## Buntáistí a bheith ag dul zoneless

```text
✓ Smaller bundle (drop ~100KB Zone.js)
✓ Better performance — fine-grained, precise updates (only what depends on changed signals)
✓ Cleaner integration with non-Angular code
✓ Simpler debugging (no zone-related stack noise)
```

## Fáth ar chóir duit a bheith i gceist

Mínítear Zone.js an bhreisiú-dhéanamh "uathoibríoch" fadó-bhunaithe Angular — agus a chostas (méid an bundle, deimhnithe leathan/doiléire).

Is é an gluaiseacht go **zoneless**, cumhachtaithe ag **signálacha**, athrú ailtireachta mór: fágann sé go bhfuil nuashonraithí fíor-ghéar agus soiléir, laghdaíonn sé an bundle, agus feabhsaíonn sé an fheidhmíochta.

Bhí tuiscint ar an dá — cén fáth a raibh Zone.js ann agus cad a chuir ina áit — níos tábhachtaí i gcónaí de réir mar atá Angular ag gealadh i dtreo todhchaí zoneless bunaithe ar shignálacha mar an dúlacht réamhshocraithe.