fbpx
Wikipedia

Svelte

January 01, 1970

For a definition of the term "svelte", see the Wiktionary entry svelte.

Svelte is a free and open-source component-based front-end software framework,[2] and language[3] created by Rich Harris and maintained by the Svelte core team members.[4]

Svelte
Original author(s)Rich Harris
Developer(s)The Svelte contributors. Key contributors include Rich Harris, Alan Faubert, Tan Li Hau, Ben McCann, and Simon Holthausen
Initial release26 November 2016; 7 years ago (26 November 2016)
Stable release
4.2.11[1]  / 15 February 2024; 2 months ago (15 February 2024)
Repositorygithub.com/sveltejs/svelte
Written inJavaScript, TypeScript
PlatformWeb platform
TypeWeb framework
LicenseMIT License
Websitehttps://svelte.dev/

Svelte is not a monolithic JavaScript library imported by applications: instead, Svelte compiles HTML templates to specialized code that manipulates the DOM directly, which may reduce the size of transferred files and give better client performance.[5] Application code is also processed by the compiler, inserting calls to automatically recompute data[2] and re-render UI elements when the data they depend on is modified.[6] This also avoids the overhead associated with runtime intermediate representations, such as virtual DOM,[7] unlike traditional frameworks (such as React and Vue) which carry out the bulk of their work at runtime, i.e. in the browser.[5][6][4][8][2][7]

The compiler itself is written in JavaScript.[9][8] Its source code is licensed under MIT License and hosted on GitHub.[8] Among comparable frontend libraries, Svelte has one of the smallest bundle footprint at merely 2KB.[10]

History edit

The predecessor of Svelte is Ractive.js, which Rich Harris created in 2013.[11]

Version 1 of Svelte was written in JavaScript and was released on 29 November 2016. It was basically Ractive with a compiler.[12] The name Svelte was chosen by Rich Harris and his coworkers at The Guardian.[12]

Version 2 of Svelte was released on 19 April 2018. It set out to correct what the maintainers viewed as mistakes in the earlier version such as replacing double curly braces with single curly braces.[12]

Version 3 of Svelte was written in TypeScript and was released on 21 April 2019. It rethought reactivity by using the compiler to instrument assignments behind the scenes.[2]

The SvelteKit web framework was announced in October 2020 and entered beta in March 2021.[13][14]

Version 4 of Svelte was released on 22 June 2023. It's a maintenance release, smaller and faster than version 3.[15] A part of this release was an internal rewrite from TypeScript back to JavaScript, with JSDoc annotations.[9] This was met with a confusion from the developer community, which was addressed by the creator of Svelte, Rich Harris.[16][17]

Key early contributors became involved with Conduitry joining with the release of Svelte 1, Tan Li Hau joining in 2019, and Ben McCann joining in 2020.[12] Rich Harris and Simon Holthausen joined Vercel to work on Svelte fulltime in 2022.[18] Dominic Gannaway joined Vercel from the React core team to work on Svelte fulltime in 2023.[19]

SvelteKit 1.0 was released in December 2022 after two years in development.[20]

Syntax edit

Svelte applications and components are defined in .svelte files, which are HTML files extended with templating syntax that is based on JavaScript and is similar to JSX.

Svelte repurposes JavaScript's native labeled statement syntax $: to mark reactive statements. Top-level variables become the component's state and exported variables become the properties that the component receives. Additionally, the { JavaScript code } syntax can be used for templating in HTML elements and components,[21] which is shown below: 

<script>  let count = 1;  $: doubled = count * 2; </script> <p>{count} * 2 = {doubled}</p> <button on:click={() => count = count + 1}>Count</button>

Associated projects edit

The Svelte maintainers created SvelteKit as the official way to build projects with Svelte. It is a Next.js-style framework that dramatically reduces the amount of code that gets sent to the browser. The maintainers had previously created Sapper, which was the predecessor of SvelteKit.[22]

The Svelte maintainers also maintain a number of integrations for popular software projects under the Svelte organization including integrations for Vite, Rollup, Webpack, TypeScript, VS Code, Chrome Developer Tools, ESLint, and prettier.[23] A number of external projects such as Storybook have also created integrations with Svelte and SvelteKit.

Influence edit

Vue.js modeled its API and single-file components after Ractive.js, the predecessor of Svelte.[11]

Adoption edit

Svelte is widely praised by developers. Taking the top ranking in multiple large scale developer surveys, it was chosen as the Stack Overflow 2021 most loved web framework[24] and 2020 State of JS frontend framework with the most satisfied developers.[25]

Svelte has been adopted by a number of high-profile web companies including The New York Times, Apple, Spotify, Square, Yahoo, ByteDance, Rakuten, Bloomberg, Reuters, Ikea, Facebook, and Brave.[26][27][28]

A community group of non-maintainers run the Svelte Summit conference, write a Svelte newsletter, host a Svelte podcast, and host a directory of Svelte tooling, components, and templates.[29]

See also edit

References edit

  1. ^ Error: Unable to display the reference properly. See the documentation for details.
  2. ^ a b c d Rich Harris (2019-04-22). "Svelte 3: Rethinking reactivity". svelte.dev. Retrieved 2021-08-07.
  3. ^ Harris, Rich (2018-11-26). "The truth about Svelte". GitHub Gist. Retrieved 2022-12-21.
  4. ^ a b Krill, Paul (December 2, 2016). "Slim, speedy Svelte framework puts JavaScript on a diet". InfoWorld.
  5. ^ a b "React vs. Svelte, the JavaScript build-time framework". react-etc.net.
  6. ^ a b "Svelte 3 Front-End Framework Moves Reactivity into the JavaScript Language, Q&A with Rich Harris". InfoQ.
  7. ^ a b Rich Harris (2018-12-27). "Virtual DOM is pure overhead". svelte.dev.
  8. ^ a b c "GitHub - sveltejs/svelte: Cybernetically enhanced web apps". January 11, 2020 – via GitHub.
  9. ^ a b "TS to JSDoc Conversion #8569". GitHub.com.
  10. ^ Frontendeng.dev (2023-08-01). "Svelte vs React: Which framework is better ?". frontendeng.dev.
  11. ^ a b Świstak, Tomasz (2020-11-19). . ValueLogic | Blog. Archived from the original on 2022-03-27. Retrieved 2021-06-10. By the way, Vue's syntax has been influenced by Ractive.js, a direct predecessor of Svelte.
  12. ^ a b c d Svelte Origins: A JavaScript Documentary, retrieved 2022-07-09
  13. ^ Rich Harris: Futuristic Web Development, archived from the original on 2021-12-12, retrieved 2021-08-03
  14. ^ Harris, Rich (2021-03-23). "SvelteKit is in public beta". svelte.dev. Retrieved 2021-08-03.
  15. ^ team, The Svelte (2023-06-22). "Announcing Svelte 4". svelte.dev. Retrieved 2023-08-08.
  16. ^ "TS to JSDoc Conversion". Hacker News (news.ycombinator.com). 2023-05-10.
  17. ^ "Lordy, I did not expect an internal refactoring PR to end up #1 on Hacker News. ..." Hacker News (news.ycombinator.com). 2023-05-10.
  18. ^ Harris, Rich (Nov 11, 2021). "today is a big day for @sveltejs: i've joined @vercel to work on it full time!". Twitter. Retrieved 2022-09-04.
  19. ^ "https://twitter.com/trueadm/status/1640761270566633472". X (formerly Twitter). Retrieved 2023-09-30. {{cite web}}: External link in |title= (help)
  20. ^ "Accouncing SvelteKit 1.0". 2022-12-14. Retrieved 2022-12-16.
  21. ^ "Svelte tutorial page", svelte.dev, retrieved 2022-07-06
  22. ^ Harris, Rich (December 31, 2017). "Sapper: Towards the ideal web app framework". svelte.dev. Retrieved 2022-11-29.
  23. ^ "Svelte". GitHub. Retrieved 2021-08-03.
  24. ^ "Stack Overflow Developer Survey 2021". Stack Overflow. Retrieved 2021-10-26.
  25. ^ "State of JS 2020: Front-end Frameworks". 2020.stateofjs.com. Retrieved 2021-10-26.
  26. ^ "Svelte • Cybernetically enhanced web apps". svelte.dev. Retrieved 2021-08-03.
  27. ^ "Websites using Svelte - Wappalyzer". www.wappalyzer.com. Retrieved 2021-08-03.
  28. ^ "Your Profile, Your Home Experience". yourhome.fb.com. Retrieved 2021-12-01.
  29. ^ "Home - Svelte Society". sveltesociety.dev. Retrieved 2021-08-03.


January 01, 1970
svelte, definition, term, svelte, wiktionary, entry, svelte, free, open, source, component, based, front, software, framework, language, created, rich, harris, maintained, core, team, members, original, author, rich, harrisdeveloper, contributors, contributors. For a definition of the term svelte see the Wiktionary entry svelte Svelte is a free and open source component based front end software framework 2 and language 3 created by Rich Harris and maintained by the Svelte core team members 4 SvelteOriginal author s Rich HarrisDeveloper s The Svelte contributors Key contributors include Rich Harris Alan Faubert Tan Li Hau Ben McCann and Simon HolthausenInitial release26 November 2016 7 years ago 26 November 2016 Stable release4 2 11 1 15 February 2024 2 months ago 15 February 2024 Repositorygithub com sveltejs svelteWritten inJavaScript TypeScriptPlatformWeb platformTypeWeb frameworkLicenseMIT LicenseWebsitehttps svelte dev Svelte is not a monolithic JavaScript library imported by applications instead Svelte compiles HTML templates to specialized code that manipulates the DOM directly which may reduce the size of transferred files and give better client performance 5 Application code is also processed by the compiler inserting calls to automatically recompute data 2 and re render UI elements when the data they depend on is modified 6 This also avoids the overhead associated with runtime intermediate representations such as virtual DOM 7 unlike traditional frameworks such as React and Vue which carry out the bulk of their work at runtime i e in the browser 5 6 4 8 2 7 The compiler itself is written in JavaScript 9 8 Its source code is licensed under MIT License and hosted on GitHub 8 Among comparable frontend libraries Svelte has one of the smallest bundle footprint at merely 2KB 10 Contents 1 History 2 Syntax 3 Associated projects 4 Influence 5 Adoption 6 See also 7 ReferencesHistory editThe predecessor of Svelte is Ractive js which Rich Harris created in 2013 11 Version 1 of Svelte was written in JavaScript and was released on 29 November 2016 It was basically Ractive with a compiler 12 The name Svelte was chosen by Rich Harris and his coworkers at The Guardian 12 Version 2 of Svelte was released on 19 April 2018 It set out to correct what the maintainers viewed as mistakes in the earlier version such as replacing double curly braces with single curly braces 12 Version 3 of Svelte was written in TypeScript and was released on 21 April 2019 It rethought reactivity by using the compiler to instrument assignments behind the scenes 2 The SvelteKit web framework was announced in October 2020 and entered beta in March 2021 13 14 Version 4 of Svelte was released on 22 June 2023 It s a maintenance release smaller and faster than version 3 15 A part of this release was an internal rewrite from TypeScript back to JavaScript with JSDoc annotations 9 This was met with a confusion from the developer community which was addressed by the creator of Svelte Rich Harris 16 17 Key early contributors became involved with Conduitry joining with the release of Svelte 1 Tan Li Hau joining in 2019 and Ben McCann joining in 2020 12 Rich Harris and Simon Holthausen joined Vercel to work on Svelte fulltime in 2022 18 Dominic Gannaway joined Vercel from the React core team to work on Svelte fulltime in 2023 19 SvelteKit 1 0 was released in December 2022 after two years in development 20 Syntax editSvelte applications and components are defined in svelte files which are HTML files extended with templating syntax that is based on JavaScript and is similar to JSX Svelte repurposes JavaScript s native labeled statement syntax to mark reactive statements Top level variables become the component s state and exported variables become the properties that the component receives Additionally the var style padding right 1px JavaScript code var syntax can be used for templating in HTML elements and components 21 which is shown below lt script gt let count 1 doubled count 2 lt script gt lt p gt count 2 doubled lt p gt lt button on click gt count count 1 gt Count lt button gt Associated projects editThe Svelte maintainers created SvelteKit as the official way to build projects with Svelte It is a Next js style framework that dramatically reduces the amount of code that gets sent to the browser The maintainers had previously created Sapper which was the predecessor of SvelteKit 22 The Svelte maintainers also maintain a number of integrations for popular software projects under the Svelte organization including integrations for Vite Rollup Webpack TypeScript VS Code Chrome Developer Tools ESLint and prettier 23 A number of external projects such as Storybook have also created integrations with Svelte and SvelteKit Influence editVue js modeled its API and single file components after Ractive js the predecessor of Svelte 11 Adoption editSvelte is widely praised by developers Taking the top ranking in multiple large scale developer surveys it was chosen as the Stack Overflow 2021 most loved web framework 24 and 2020 State of JS frontend framework with the most satisfied developers 25 Svelte has been adopted by a number of high profile web companies including The New York Times Apple Spotify Square Yahoo ByteDance Rakuten Bloomberg Reuters Ikea Facebook and Brave 26 27 28 A community group of non maintainers run the Svelte Summit conference write a Svelte newsletter host a Svelte podcast and host a directory of Svelte tooling components and templates 29 See also edit nbsp Free and open source software portal JavaScript library Comparison of JavaScript frameworksReferences edit Error Unable to display the reference properly See the documentation for details a b c d Rich Harris 2019 04 22 Svelte 3 Rethinking reactivity svelte dev Retrieved 2021 08 07 Harris Rich 2018 11 26 The truth about Svelte GitHub Gist Retrieved 2022 12 21 a b Krill Paul December 2 2016 Slim speedy Svelte framework puts JavaScript on a diet InfoWorld a b React vs Svelte the JavaScript build time framework react etc net a b Svelte 3 Front End Framework Moves Reactivity into the JavaScript Language Q amp A with Rich Harris InfoQ a b Rich Harris 2018 12 27 Virtual DOM is pure overhead svelte dev a b c GitHub sveltejs svelte Cybernetically enhanced web apps January 11 2020 via GitHub a b TS to JSDoc Conversion 8569 GitHub com Frontendeng dev 2023 08 01 Svelte vs React Which framework is better frontendeng dev a b Swistak Tomasz 2020 11 19 About the Svelte JavaScript framework ValueLogic Blog Archived from the original on 2022 03 27 Retrieved 2021 06 10 By the way Vue s syntax has been influenced by Ractive js a direct predecessor of Svelte a b c d Svelte Origins A JavaScript Documentary retrieved 2022 07 09 Rich Harris Futuristic Web Development archived from the original on 2021 12 12 retrieved 2021 08 03 Harris Rich 2021 03 23 SvelteKit is in public beta svelte dev Retrieved 2021 08 03 team The Svelte 2023 06 22 Announcing Svelte 4 svelte dev Retrieved 2023 08 08 TS to JSDoc Conversion Hacker News news ycombinator com 2023 05 10 Lordy I did not expect an internal refactoring PR to end up 1 on Hacker News Hacker News news ycombinator com 2023 05 10 Harris Rich Nov 11 2021 today is a big day for sveltejs i ve joined vercel to work on it full time Twitter Retrieved 2022 09 04 https twitter com trueadm status 1640761270566633472 X formerly Twitter Retrieved 2023 09 30 a href Template Cite web html title Template Cite web cite web a External link in code class cs1 code title code help Accouncing SvelteKit 1 0 2022 12 14 Retrieved 2022 12 16 Svelte tutorial page svelte dev retrieved 2022 07 06 Harris Rich December 31 2017 Sapper Towards the ideal web app framework svelte dev Retrieved 2022 11 29 Svelte GitHub Retrieved 2021 08 03 Stack Overflow Developer Survey 2021 Stack Overflow Retrieved 2021 10 26 State of JS 2020 Front end Frameworks 2020 stateofjs com Retrieved 2021 10 26 Svelte Cybernetically enhanced web apps svelte dev Retrieved 2021 08 03 Websites using Svelte Wappalyzer www wappalyzer com Retrieved 2021 08 03 Your Profile Your Home Experience yourhome fb com Retrieved 2021 12 01 Home Svelte Society sveltesociety dev Retrieved 2021 08 03 Retrieved from https en wikipedia org w index php title Svelte amp oldid 1210470585, wikipedia, wiki, book, books, library,

article

, read, download, free, free download, mp3, video, mp4, 3gp, jpg, jpeg, gif, png, picture, music, song, movie, book, game, games.