Svelte je jednostavan okvir koji je jednostavan za korištenje, a njegove najnovije promjene trebale bi ga učiniti još lakšim.

U lipnju 2023. Svelte je najavio svoje najnovije stabilno izdanje, verziju 4. Ažuriranje Svelte 4 prvenstveno je izdanje za održavanje Svelte 3, s ciljem postavljanja pozornice za sljedeću generaciju Sveltea koja će biti objavljena kao Svelte 5.

Svelte 4 dodaje različita poboljšanja Svelte ekosustavu, uključujući redizajn web stranice, postavljanje lokalnih prijelaza kao zadanih, poboljšanje podrške za web komponente i prelazak s TypeScripta na JSDoc.

1. Moderan redizajn stranice

Svelte 4 stigao je zajedno s poboljšanjima na službenom Svelte web stranica. Novi izgled stranice je fantastičan, s poboljšanim TypeScript dokumentima, opciju tamnog načina rada, te općenito poboljšano korisničko iskustvo na svim uređajima.

Stranica Svelte sada ima poboljšani REPL koji vam omogućuje eksperimentiranje sa Svelte kodom izravno u pregledniku.

Također, sve veze na Svelte vodiče sada upućuju na novo Svelte iskustvo učenika, dok su stari vodiči dostupni za korisnike Safarija 16.3 i starijih.

2. Lokalni prijelazi su zadani

Zamislite bolno iskustvo kada ste se morali zadovoljiti CSS prijelazima nakon što ste gledali kako se vaša stranica učitava dulje od očekivanog jer ste koristili Svelte prijelaze.

Obično se prijelaz reproducira kada uništite roditeljski blok. Ovo ponašanje možete nadjačati pomoću |lokalno modifikator. To uzrokuje pokretanje prijelaza samo kada uništite blok koji sadrži ciljnu komponentu. U Svelte 4, ovo |lokalno modifikator je postavljen kao zadani za prijelaze.

U isječku ispod, prijelaz slajdova je lokalno dodan u div element:

 {artikal}

3. Poboljšana podrška za web komponente

Svelte je oduvijek promicao mogućnost ponovne upotrebe i održavanja, otuda njegova stalna podrška za web komponente. Web komponente vam omogućuju stvaranje prilagođenih HTML elemenata za višekratnu upotrebu s umetnutim stilovima i ponašanjem.

Svelte 4 mijenja način na koji generira web komponente, uklanjajući greške i nedosljednosti. Te promjene uključuju:

  • Izvoz stvara rekvizit komponente, čineći je dostupnom potrošačima komponente.
  • Zadaci su reaktivni. Da biste promijenili stanje komponente i pokrenuli ponovno iscrtavanje, dodijelite je lokalno deklariranoj varijabli.
  • Koristiti $ simbol na početku izjave kako bi je označili kao reaktivnu izjavu. Reaktivne izjave pokreću se nakon drugog koda skripte i prije renderiranja oznake komponente, kad god se promijene ovisne vrijednosti.
  • Kada kreirate objekte trgovine, dodajte prefiks trgovini sa $ kako bi se omogućio reaktivni pristup vrijednosti.
  • Postavljanje atributa konteksta oznake skripte na modul uzrokuje da se skripta jednom pokrene kada modul prvi put izvrši procjenu, a ne za svaku instancu komponente.

4. Prijelaz s TypeScripta na JSDoc

JSDoc je dokumentacijski alat koji podržava dodavanje bilješki tipa i komentara u JavaScript kodove.

Uzimajući u obzir da JSDoc prevari programere da dokumentiraju svoje kodove, ova migracija ima za cilj potaknuti više Svelte programera da steknu naviku ispravnog dokumentiranja svojih kodova. Adekvatno dokumentirana JavaScrpt baza koda zahtijevala bi malo ili nimalo provjere tipa.

Ako ste novi u TypeScriptu, trebali biste istražite TypeScript i otkrijte zašto ga programeri preferiraju.

Prelazak na Svelte 4

Svelte 4 ima poboljšanu izvedbu i pojednostavljen razvoj, što je izvrsno za izradu visokoučinkovitih web aplikacija. Ovo novo izdanje također bi trebalo potaknuti bolju dokumentaciju koda s prelaskom na JSDoc.

Svelte se nastavlja poboljšavati i iako to nije okvir s kojim je upoznat svaki programer, oni koji jesu ga jako hvale.