Is Svelte a good choice for widget implementation?

Hello! My name is Dmitry Usov, I am a front-end developer in Citimobil. Just a few months ago, the task was to create a widget for ordering a taxi through the site. In this article I would like to tell why Svelte was chosen for this task, to share my opinion about its advantages and disadvantages, as well as useful links, if you decide to study or apply this technology.

Initial data

Task: create a widget for ordering a taxi through the site.

, .

:

1. :
   
   • . , .
2. :
   
   • . .
   • DOM . .
   • , , .

— . React, Vue Angular .

, Preact Svelte.

:

1. runtime.
2. Stateofjs — , .

Preact: React, .

Svelte:

1. .
2. , . Preact , React , .
3. Mail.ru Svelte.

, Svelte.

Svelte

Svelte — . , React Vue, , Svelte , .

, Svelte.

.

, Svelte , . , , , .

— . — Svelte ( ).

: reverse proxy CORS. rollup, , , , hot reload, proxy, , . rollup webpack.

, , , .

, Svelte

, .

: , — . , , .

JS/HTML/CSS . Vue/React/Angular, , Svelte - .

1. runtime (min+gzip) 1,4 .
2. virtual DOM. Svelte , .
3. .
4. CSS. - CSS-, linter . , .

1. .
2. .
3. .
4. context stores, .
5. Actions. AlexxNB, .
6. , - . , JS-, CSS- , , JS .

1. .
2. , , , , Svelte.
3. Telegram, 1500 .
4. Discord (sapper, svelte, jobs, typescript, etc).

Svelte

, .

, : , — . , , .

Gitlab

Svelte Gitlab . . PaulMaly , gitattributes .

Svelte , ErrorBoundary React. , , , , Sentry. JS .

.

1. , .
2. , . Svelte . , , .
3. Svelte — , , , , , . , .

vscode

• , Svelte, : « Svelte ?»
• Svelte.
• discord
• dev.to
• Typescript
• State of Svelte 2020
• Autoimport svelte
• Svelte syntax
• Svelte intellisense
• Svelte snippets

, , , , , .