Svelte
Svelte is a free and open-source front end[4] JavaScript framework[5] created by Rich Harris and maintained by Harris and other Svelte core team members.[6] Svelte applications do not include framework references. Instead, building a Svelte application generates code to manipulate the DOM, which may reduce the size of transferred files as well as give better client startup and run-time performance. Svelte has its own compiler for converting app code into client-side JavaScript at build time. It is written in TypeScript.[7][8] The Svelte source code is licensed under MIT License and hosted on GitHub.[9]
Original author(s) | Rich Harris |
---|---|
Initial release | November 26, 2016[1] |
Stable release | 3.31.2
/ January 4, 2021[2] |
Repository | Svelte Repository |
Written in | TypeScript |
Platform | Web platform |
Size | 4.1 KB[3] |
Type | Web framework |
License | MIT License |
Website | svelte |
History
The predecessor of Svelte is Ractive.js, which Rich Harris had developed earlier.
Version 1 of Svelte was written in JavaScript and was released in 29 November 2016.
Version 2 of Svelte was released in 19 April 2018.
Version 3 of Svelte is written in TypeScript and was released in 21 April 2019.
Example
Svelte applications and components are defined in .svelte
files, which are HTML files extended with templating syntax that is similar to JSX. Svelte repurposes JavaScript's label syntax $:
to mark reactive statements. Top-level variables become the component's state and exported variables become the properties that the component receives.
<script>
let count = 1;
$: doubled = count * 2;
</script>
<p>{count} * 2 = {doubled}</p>
<button on:click={() => count = count + 1}>Count</button>
Influence
Vue.js modelled its API and single-file components after Ractive.js, the predecessor of Svelte.
See also
References
- "Frameworks without the framework: why didn't we think of this sooner?". Svelte.
- "Svelte Releases". GitHub. January 8, 2021.
- "[email protected]". BundlePhobia. January 8, 2021.
- https://en.wikipedia.org/wiki/Front_end_and_back_end Missing or empty
|title=
(help) - "React vs. Svelte, the JavaScript build-time framework". react-etc.net.
- "Svelte 3 Front-End Framework Moves Reactivity into the JavaScript Language, Q&A with Rich Harris". InfoQ.
- "8 Most Interesting JavaScript Frameworks to Learn in 2019 - Developer Drive". www.developerdrive.com.
- Krill, Paul (December 2, 2016). "Slim, speedy Svelte framework puts JavaScript on a diet". InfoWorld.
- "GitHub - sveltejs/svelte: Cybernetically enhanced web apps". January 11, 2020 – via GitHub.