Svelte je preprosto ogrodje, ki je enostavno za uporabo, zadnje spremembe pa bi ga morale še olajšati.

Junija 2023 je Svelte objavil svojo najnovejšo stabilno izdajo, različico 4. Posodobitev Svelte 4 je predvsem vzdrževalna izdaja Svelte 3, katere cilj je pripraviti temelje za naslednjo generacijo Svelte, ki bo izdana kot Svelte 5.

Svelte 4 dodaja različne izboljšave ekosistemu Svelte, vključno s prenovo spletnega mesta, nastavitvijo lokalnih prehodov kot privzetih, izboljšano podporo za spletne komponente in prehodom s TypeScript na JSDoc.

1. Preoblikovanje elegantnega spletnega mesta

Svelte 4 je prispel skupaj z izboljšavami uradnega Svetlo spletno mesto. Nov videz spletnega mesta je fantastičen, z izboljšanimi dokumenti TypeScript, možnost temnega načinain na splošno izboljšano uporabniško izkušnjo v vseh napravah.

Spletno mesto Svelte ima zdaj izboljšan REPL, ki vam omogoča eksperimentiranje s kodo Svelte neposredno v brskalniku.

Prav tako vse povezave do vadnic Svelte zdaj kažejo na novo izkušnjo učencev Svelte, medtem ko so stare vadnice na voljo uporabnikom Safarija 16.3 in starejših.

instagram viewer

2. Lokalni prehodi so privzeti

Predstavljajte si bolečo izkušnjo, ko ste se morali zadovoljiti s prehodi CSS, potem ko ste opazovali, kako se vaša stran nalaga dlje, kot je bilo pričakovano, ker ste uporabili prehode Svelte.

Običajno se prehod predvaja, ko uničite nadrejeni blok. To vedenje lahko preglasite z |lokalno modifikator. To povzroči, da se prehod izvede samo, ko uničite blok, ki vsebuje ciljno komponento. V Svelte 4, to |lokalno modifikator je nastavljen kot privzeti za prehode.

V spodnjem delčku je prehod med diapozitivi lokalno dodan v div element:

 {item}

3. Izboljšana podpora za spletne komponente

Svelte je vedno spodbujal ponovno uporabnost in vzdržljivost, zato nenehno podpira spletne komponente. Spletne komponente vam omogočajo ustvarjanje elementov HTML po meri za večkratno uporabo z vstavljenimi slogi in vedenjem.

Svelte 4 spreminja način, na katerega ustvarja spletne komponente, odpravlja hrošče in nedoslednosti. Te spremembe vključujejo:

  • Izvozi ustvari komponento prop, ki jo naredi dostopno uporabnikom komponent.
  • Dodelitve so reaktivne. Če želite spremeniti stanje komponente in sprožiti ponovno upodabljanje, jo dodelite lokalno deklarirani spremenljivki.
  • Uporabi $ simbol na začetku izjave, da jo označite kot reaktivno izjavo. Reaktivni stavki se izvajajo za drugo kodo skripta in preden se upodobi oznaka komponente, kadar koli se spremenijo odvisne vrednosti.
  • Ko ustvarjate predmete trgovine, dodajte predpono trgovini z $ omogočiti reaktiven dostop do vrednosti.
  • Nastavitev atributa konteksta oznake skripta na modul povzroči, da se skript zažene enkrat, ko modul prvič oceni, namesto za vsak primerek komponente.

4. Prehod s TypeScript na JSDoc

JSDoc je orodje za dokumentacijo, ki podpira dodajanje pripisov in komentarjev tipom kodam JavaScript.

Glede na to, da JSDoc prelisiči razvijalce, da dokumentirajo svoje kode, je cilj te migracije spodbuditi več razvijalcev Svelte, da si ustvarijo navado pravilnega dokumentiranja svojih kod. Ustrezno dokumentirana kodna baza JavaScrpt bi zahtevala malo ali nič preverjanja tipa.

Če ste novi v TypeScriptu, bi morali raziščite TypeScript in odkrijte, zakaj ga imajo razvijalci raje.

Selitev na Svelte 4

Svelte 4 ima izboljšano zmogljivost in poenostavljen razvoj, kar je odlično za izdelavo visoko zmogljivih spletnih aplikacij. Ta nova izdaja bi morala spodbuditi tudi boljšo dokumentacijo kode s prehodom na JSDoc.

Svelte se še naprej izboljšuje in čeprav to ni okvir, ki bi ga poznal vsak razvijalec, ga tisti, ki ga poznajo, močno hvalijo.