I had a cool idea for a code preview component in Animotion while working on a video
It's just an <iframe> you control the contents of using the same code update API for each block and resolve imports using an import map
You could also compile Svelte components this way
You can update to the latest version of Animotion to use the new code update API ❤️
I also cooked the Easter ham 😤
I'm exploring a Svelte version of Remotion for making videos using code
I'm trying out a new API to improve how code updates work in Animotion 🪄
Having to pass the entire code string to `update` is a thing of the past with the new `append`, `insert`, `replace` and `remove` methods ✨
animotion.pages.dev/docs/code#co...
I added the new code selection API to Animotion! 🥳
The new `select` and `selectAdd` methods allow for more granular code selection without having to know which tokens are selectable
You can update and try it now
Svelte is taking a leap towards supporting other rendering targets besides the DOM like terminals and native mobile apps
Think I cracked the ideal code selection API for Animotion
The current version expects you to know which tokens to select and is awkward to use when there are multiple identical tokens
The new API would be more intuitive to use and fix these issues
That's for legacy addons but I'm going to update the docs to make it more clear
I took a deep dive explaining the magic behind Shiki Magic Move from how it diffs code to how it orchestrates transitions for smoothly animated code blocks 🔥
youtu.be/mjw3X6bPIpA
You have to use instance mode but the basic example doesn't work for some reason
I learned import maps let you control how imports are resolved so I made a REPL that can load the Svelte runtime and resolve imports over a CDN 🔥
I use Arch by the way
I wouldn't care if GitHub wasn't just left to rot over the years and spawned a cottage industry of services to pick up the slack
It's not going to stop them but it's a virtual middle finger to Microslop
Don't let them farm you 🧑🌾
Real-time data is coming to SvelteKit 🔥
Awesome thing about SvelteKit remote functions is that you only have to check for auth when it's required instead of every request inside hooks
Happy to help 🫡
1. Put them in the `static` folder so they're available from the root `/sfx.mp3` or import them from anywhere using `import sfx from '$lib/assets/sfx.mp3'`
2. You can import addons like any other JavaScript file
3. They both work
4. Create another `<P5Sketch>` and pass your sketch
View transitions are supported by most browsers so take advantage of them 🔥
Let's talk about how to smoothly animate code blocks using TypeScript and Shiki Magic Move 🪄
youtu.be/wGf0PUlOQoA
I made a p5.js wrapper for Svelte you can install with `npm i @sveltecraft/p5-svelte` or watch the video where I explain how it's used and making old libraries work in Svelte
youtu.be/97bD9ZHwv2U
The new Firefox redesign competes with Vivaldi over which one looks worse by default
I explored the DX of p5.js global mode when using instanced mode so I asked the clanker to make a proxy wrapper
Sounds great in theory but manual destructuring and not having autocomplete kind of sucks
Yeah I'm not a fan of API usage pricing unless it has knobs to set a limit, but from what I know it can also be more expensive per token than using a plan
I'm trying clanker value plans that don't lock you into some cringe editor as I'd rather spend the money on kebab
GitHub Copilot $10/m is great to get started and has a free trial — I'm trying OpenCode Go $10/m with GLM-5, Kimi, MiniMax
Anything else you recommend trying?
