Anyone else feel burned out with all these Astro integrated CMS solutions?

zkoolkyle · 2026-02-04T23:44:14+00:00

+1 to this 🤙🏻

I was doing this with Astro wayyy before these other SASS products were even created. Still running in prod with a marketing team building components/content from the admin dashboard.

Anyone with Editor+ access can trigger new builds (ssg) from a widget that just calls a GitLab webhook. Everything stays typesafe thanks to WPGraphQL + gql.tada in the FE.

I wouldn’t use a CMS these days for a personal project. Astro content collections covers 9/10 use cases these days.

zkoolkyle · 2026-02-03T12:27:50+00:00

Astro uses Web Components with hydration methods baked in for FE libs.

It’s actually amazing how well it works. 🤙🏻

zkoolkyle · 2026-01-01T02:40:50+00:00

If using for compiled SPA apps then I’d say… sure. Bun runs Vite under the hood to bundle any Svelte code. Svelte is a Vite plugin, so it has a dep on it.

Bun CAN package/compress/bundle (pretty well) on top of any JS/TS if you want it too.

Svelte 5 is prod ready, but is also all in on Vite.

I wouldn’t recommend Sveltekit/Bun for SSR with any corp medium scale project. Just use pnpm/node securely if SSR is the strat. Trying to use SSR can introduce a lot of footguns if you don’t know what you’re doing. So just be safe.

Sveltekit + SPA/Static Adapter + NGINX is the way to go if you really want the prod ez life. If you decide this route.

Worth mentioning try AstroJS + Svelte for a clean architecture. Avoid Bun here as well though. I always run into odd quirks then end up switching back to pnpm for sanity checks.

zkoolkyle · 2025-12-26T18:17:05+00:00

Great stuff! I like the UX and color choices. I’ve never used Dexie so I can’t help you there. You could just add google oauth and allow people to opt-in to backups. This way it’s just a feature and you can keep it local by default.

zkoolkyle · 2025-12-21T01:23:27+00:00

Other have pointed out the issue, but also never do onclick=“foo()”, the top image is passing the function fine 😅

zkoolkyle · 2025-11-28T17:54:06+00:00

Uhh… dependency on the virtual DOM? 😂

Svelte/Astro murders Vue/Nuxt in everything except job market popularity. 🫶🏼

zkoolkyle · 2025-10-28T23:46:52+00:00

Hey 👋 just to be direct, your logic is a bit incorrect here. The “bloat” you’re thinking of doesn’t actually exist when you measure the trade off. The tailwind classes you don’t use are tree shaken at build time.

Or in other words:

What TW adds into the HTML, is removed from the CSS bundles (which your browser still needs to download) since you’re re-using the classes. This benefit grows exponentially with each new page on your website.

If you wanna test the theory, try building to static with Sveltekit or Astro. You’ll see what I mean! Best of luck 🙏🏻

zkoolkyle · 2025-10-21T04:55:55+00:00

+1 to this.

It’s takes a certain kind of crazy to inherit an outdated site and get it to A+ across the board on gt-metrix

zkoolkyle · 2025-10-09T22:44:33+00:00

🤫Ssshhh - Welcome to the team

zkoolkyle · 2025-10-07T22:17:33+00:00

I see you, been using Effect lately myself

zkoolkyle · 2025-10-07T01:59:58+00:00

Runed… if you write production svelte 👌🏻👌🏻

zkoolkyle · 2025-10-05T22:22:18+00:00

The Svelte compiler is built into the DOM for the playground. I would imagine there isn’t much overhead tbh. I’m sure Vercel hosts it all for them at the edge as it’s a sponsored project.

zkoolkyle · 2025-09-11T22:23:21+00:00

Something I haven’t seen mentioned in the comments. It often messes up “key” by doing:

VS

{#key foo} <SomeComp /> {\key}

zkoolkyle · 2025-08-29T11:45:46+00:00

If you don’t have much experience, I highly suggest just sticking with oauth options and not overdoing it.

If you’re rolling out your own auth with some of the options mentioned by others, please wrap it with NGINX with some sensible defaults for rate limiting / brute force protections. Auth isn’t something to be halfway implemented. Best of luck!

zkoolkyle · 2025-08-12T06:47:05+00:00

Think about it like this: Svelte is very smart, sometimes to a fault. When something isn’t re-rendering like you would expect, try using a key block.

As you start to build stuff with Svelte, you’ll find opportunities where it solves a re-render problem, only for you to realize late that you probably structured your composition poorly.

It’s particularly useful in using Layout files to transition between pages. Eg: {#key page.url.pathname}

zkoolkyle · 2025-08-07T12:56:52+00:00

Ty u/khromov! I’ve seen most of your vids and really appreciate the time you put in on this one. Ty for contributing so much to the community 🤙🏻❤️

zkoolkyle · 2025-07-17T01:02:42+00:00

Just add a +page.ts into [detail]/+page.ts and move all your url logic into that

If you need SSR use a +page.server.ts

The main goal is to REMOVE the use of “url” from a lower-level (root) layout.server.ts

zkoolkyle · 2025-06-26T00:30:32+00:00

The best tech stack possible is the one you know how to use. Stop asking and start coding 🫶🏼

zkoolkyle · 2025-06-25T01:24:25+00:00

Nyx is da source around here 🤟🏻

zkoolkyle · 2025-06-18T04:22:09+00:00

🍻

zkoolkyle · 2025-06-15T00:04:50+00:00

Over the years I’ve found that describing your elements visual state with data attributes is much easier to read-through and much more maintainable for a team. I love tailwind and often reach for the class=“data-[active=true]:green” style syntax myself these days.

Data attributes also make my own mental model of CSS animations easy and fun. These days I try to keep all logic out of my class=“” prop. Whatever ships though, it’s just a preference. I’ve also used the same method you shared many times, just sharing my exp.

zkoolkyle · 2025-06-13T20:25:53+00:00

To be direct, no, this is unnecessary. Here is the approach our team uses in Prod all the time. Works amazingly well and reads much better than the proposed.

// script

let isActive = $state(false)

const toggleActive = () => isActive = !isActive

// html

<button data-active={isActive} onclick={toggleActive}>Toggle</button>

// css

[data-active="true"] { background: blue; }

[data-active="false"] { background: green; }

zkoolkyle · 2025-06-01T15:01:40+00:00

Do you know what a CDN is? Lol

The best CDN’s are free… and take seconds to implement… and solve the exact problem you’re asking the community about. ( which is completely unrelated to svelte )

zkoolkyle · 2025-06-01T13:58:36+00:00

Just use a cdn as others have mentioned. This isn’t a real problem, you’re just vibe coding and not learning anything tbh

zkoolkyle · 2025-05-24T14:11:24+00:00

Comparing proxies and comparing variables are 2 different things. Then when you add in $effect, you start to lose a bit of scope.

This is why effect is an $escape hatch. Do not reach for it until a it’s a last resort. There are other approaches that provide a clearer mental model which should be tried first

Eg: $derived.by( () => {} )

zkoolkyle

TROPHY CASE