I find myself following a few recipes when creating new Svelte components.
You'll find that most of this code is focused on visualizing data, just due to what I'm typically building.
Instead of creating a chart library, I prefer to curate recipes , which keeps things super flexible.
I'll usually have a utils.js file that I throw custom methods into for easy use. Here are some of those methods.
- tweened-staggeredA tweaked version of the official svelte
tweenedmethod, with two updates: a: it takes an
iDelayconfiguration option, which staggers the transition of individual items in a tweened array, and b: it uses d3.js's interpolation function, which handles interpolation of colors.
transform: translatecss style to keep code concise. I like to use
transforms liberally, since they are easy to animate (via CSS transitions), and one of the most performant ways to animate on the web.