Skip to content

Commit 5913b2f

Browse files
Update and rename 0000-template.md to 0000-switch-block.md
1 parent 5cf5b1c commit 5913b2f

File tree

2 files changed

+86
-94
lines changed

2 files changed

+86
-94
lines changed

0000-switch-block.md

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
- Start Date: 2021-4-29
2+
- RFC PR:
3+
- Svelte Issue:
4+
5+
# Switch Block
6+
7+
## Summary
8+
9+
> This feature is a switch statement but for declaring reactive UI simmilar to `{#if}`.
10+
> It will behave exactly the same as a switch statement in regular programming.
11+
12+
## Motivation
13+
14+
> This could be useful for simple single page app that needs to switch between layouts,
15+
> like if you wanted a login/signup/logout/forgot password page, each page would only
16+
> have their own seperate elements, but not enough to warrant multiple svelte files.
17+
18+
> It would be easier to do simple layout changes where you need to modify the layout
19+
> based on dynamic data and you don't want to do a large amount of `{:else if}`
20+
> blocks. Plus it would better describe the behaviour of what it's doing.
21+
22+
> With switch statements you do not have to reference your varible multiple times
23+
> and possibly use more resources than required. That's the main benefit to
24+
> switch statements in programming, performance!
25+
26+
> My reasoning for adding this is mainly syntactic sugar (lots of else if blocks are ugly),
27+
> but the performance benefits of a switch statement are real.
28+
29+
## Detailed design
30+
```
31+
{#switch *condition*} -- The default tags could be under the main switch statement, or it could be in a seperate tag as {:default}
32+
<Default Content>
33+
{:case *constant expression*}
34+
<Case specific content>
35+
{/switch}
36+
```
37+
38+
### Technical Background
39+
40+
> There are the standard docs for many languages such as
41+
> c++ https://docs.microsoft.com/en-us/cpp/cpp/switch-statement-cpp?view=msvc-160
42+
> JavaScript: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch
43+
> Many languages I have seen just use the standard c syntax so there is no need to list more
44+
45+
> React just uses normal javascript switch statements and then returns different values. https://sebhastian.com/react-switch/
46+
> There is a vue module which brings support for switch statements https://www.npmjs.com/package/v-switch-case
47+
48+
### Implementation
49+
50+
> It behaves very simmilar to `{#if}`, `{:else if}`, and `{:else}`, but
51+
> the conditions are static and it's backed by the switch statement of normal javascript.
52+
> The `{:else}` block is now in the `{#switch}` block, and the `{#if}` and `{#else if}`
53+
> conditions now are located in `{:case}`. I came to this after I was making a page
54+
> for doing various account auth related things with login, logout, signup, and reset password
55+
> which could all be put in one svelte file and didn't need their own files but the switch
56+
> statement which I use regularly in javsacript doesn't exist. So I had to use `{#else if}` blocks
57+
> as a bulky, inefficient stand in for a switch statement.
58+
59+
## How we teach this
60+
61+
> It would talk about the logic
62+
63+
> Would the acceptance of this proposal mean the Svelte guides must be
64+
re-organized or altered? Does it change how Svelte is taught to new users
65+
at any level?
66+
67+
> How should this feature be introduced and taught to existing Svelte
68+
users?
69+
70+
## Drawbacks
71+
72+
> The only real drawback that I could see is a very minescule bundle size increase,
73+
> since this is only adding on a new conditional block and not modifying a core feature
74+
> it most likely wont affect any current projects.
75+
76+
> It may be confusing to some newer programmers to why you need switch statements when you
77+
> already have if statements.
78+
79+
## Alternatives
80+
81+
> Just not do this because you can already do this with relative ease, but this will
82+
> bring slight performance improvements to apps that use it as well as cleaner syntax.
83+
84+
## Unresolved questions
85+
86+
> Wether it uses `{:default}` or the default markup tags will just go below the `{#if}` statement.

0000-template.md

Lines changed: 0 additions & 94 deletions
This file was deleted.

0 commit comments

Comments
 (0)