Comments (9)
Was about to suggest the similar optimization. Plucking methods like document.createElement
into the variables at the top of the module (like const __createElement = document.createElement.bind(document)
) will help the minifier when the components have many nodes.
from svelte.
Yup. I did a little test locally yesterday, and found about a 20% savings by doing this on a relatively small project.
from svelte.
We should definitely do this. As a starting point, helpers like createElement
and detachElement
would reduce the size a bit (gzip notwithstanding) and could be externalised if necessary. I hadn't thought of custom factories though, that's an interesting idea.
from svelte.
cloneNode could be helpful here, too.
from svelte.
BTW does it make sense to have elementWithClass
actually compatible with React.createElement
which is (name, attributes, children)
?
Who knows if it will provide some positive side-effect like JSX compatibility?
from svelte.
@emirotin you want to avoid polymorphic functions like that, that's why Inferno avoids them in core – they result in functions that can't be properly optimised.
from svelte.
Interesting @trueadm thanks for the insight.
from svelte.
Helpers have been in Svelte for a while, is this issue open for other helpers? Like the suggested elementWithClass
and potentially similar ones like elementWithId
?
from svelte.
Probably slightly trickier to do elementWithClass
in Svelte's current form, because creating nodes and adding attributes happens in two separate places (so that hydration can work). So maybe we should close this and revisit it if we ever need to eke out a few extra microseconds 😀
from svelte.
Related Issues (20)
- SVGs with animateTransform lag for an extremely long time when embedded HOT 7
- Transitions are present before delay is reached HOT 1
- Writing an import statement inside the markup as document content makes Svelte process it HOT 4
- missing type of HTMLAttribute HOT 4
- Svelte 5: Add warning to compiler when using `bind:value` incorrectly HOT 2
- Svelte 5 migrate function throws if there's no semicolon at the end of a reactive statement
- Svelte 5: Chrome: svelte-select list is not opened on the first click (same code of Svelte 4) HOT 21
- Option to extends components HOT 2
- `remove_input_attr_defaults` function is slow during hydration HOT 5
- Svelte 5: restrict which characters can be used in component props HOT 1
- Nested `:global` selectors HOT 7
- Svelte 5. relative attribute selector, inside a :global(...) selector, is being scoped
- Allow the default value for a $property to be a $state() HOT 2
- Unnecessary recalculation of derived value when element added/removed from DOM HOT 2
- svelte(a11y-label-has-associated-control) shows incorrectly when using render snippet HOT 4
- Svelte 5: setting input value to an object property, updating a store, and using the store value in the template causes input to be reset HOT 4
- Svelte 5: CSS Comments between selector and brackets {} causing compilation error
- Svelte 5: Bug with data exposed to a slot in a slot
- svelte5: reactivity package classes are not fine-grained HOT 2
- How to use svelte 5 without sveltekit HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from svelte.