Svelte

From Wikipedia, the free encyclopedia
Jump to navigation Jump to search
Svelte
Svelte Logo.svg
Original author(s)Rich Harris
Initial releaseNovember 26, 2016; 4 years ago (2016-11-26)[1]
Stable release
3.32.3[2] Edit this on Wikidata / 11 February 2021; 24 days ago (11 February 2021)
RepositorySvelte Repository
Written inTypeScript
PlatformWeb platform
Size4.1 KB[3]
TypeWeb framework
LicenseMIT License
Websitesvelte.dev

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]

History[edit]

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[edit]

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[edit]

Vue.js modelled its API and single-file components after Ractive.js, the predecessor of Svelte.

See also[edit]

References[edit]

  1. ^ "Frameworks without the framework: why didn't we think of this sooner?". Svelte.
  2. ^ "Release 3.32.3". 11 February 2021. Retrieved 17 February 2021.
  3. ^ "Svelte@3.31.2". BundlePhobia. January 8, 2021.
  4. ^ https://en.wikipedia.org/wiki/Front_end_and_back_end Missing or empty |title= (help)
  5. ^ "React vs. Svelte, the JavaScript build-time framework". react-etc.net.
  6. ^ "Svelte 3 Front-End Framework Moves Reactivity into the JavaScript Language, Q&A with Rich Harris". InfoQ.
  7. ^ "8 Most Interesting JavaScript Frameworks to Learn in 2019 - Developer Drive". www.developerdrive.com.
  8. ^ Krill, Paul (December 2, 2016). "Slim, speedy Svelte framework puts JavaScript on a diet". InfoWorld.
  9. ^ "GitHub - sveltejs/svelte: Cybernetically enhanced web apps". January 11, 2020 – via GitHub.

External links[edit]