Tarun

23 | Senior Software Engineer @Appinventiv | Building Performant and Scalable PWAs –– Building 🔖

[Tarun @tarunfy]

@pqoqubbw Less go!

[Tarun @tarunfy]

https://t.co/zZMe7gwWZ2

[Tarun @tarunfy]

Weekend project: A personal PWA for bookmarks reading that brings together my X and Raindrop bookmarks in one place, and uses a local LLM to generate AI descriptions and labels for each item. No database or server calls. Fast and polished. Thanks Fable ✨

[shadcn @shadcn]

We are going to make one big change to shadcn/ui this week.

[Tarun @tarunfy]

@karankendre It will fallback to Opus 4.8 for tasks like coding. Please read their other post.

[Matt Shumer @mattshumer_]

So uh, Fable will be useless?

Apparently coding work will fall back to Opus.

[Tarun @tarunfy]

So sick!!

[dmytro @pqoqubbw]

new beautiful landing page, go check it out

[Next.js @nextjs]

Next.js 16.3 Preview: Instant Navigations

A new suite of tools that brings the responsiveness of client-driven SPAs to Next.js, without giving up what Server Components do best. The speed of the server, with the feel of the client.

Try it and tell us what you think ↓

https://t.co/748bguaCMb

[Tarun @tarunfy]

@lochieaxon woah!

[Sebastiano Guerriero @guerriero_se]

Use motion to reduce UI travel.

[Gabriel @gabriell_lab]

Design Engineering Tip:

Separate the object from its shadow.

When an element lifts away from a surface, the shadow doesn't always need to move with it. Keeping the shadow grounded and fading it based on distance can create a stronger sense of depth and physicality.

Used carefully, this can make interfaces feel more tangible and less like layers floating on a screen. It's not something I'd apply everywhere, but for moments that need extra emphasis, it can be surprisingly effective.

js
const card = document.querySelector(".notification"); const shadow = document.querySelector(".shadow"); card.animate( [ { transform: "translateY(0)" }, { transform: "translateY(-160px)" }, ], { duration: 900, easing: "cubic-bezier(.64,0,.78,0)" } ); shadow.animate( [ { opacity: 0.5, transform: "scaleX(1)" }, { opacity: 0, transform: "scaleX(.35)" }, ], { duration: 700, easing: "ease-out" } );

[Tarun @tarunfy]

@_ApexStatus still broken 😞

[shadcn @shadcn]

@nishimiya Most animations are decorative only look good in demos. In real-world apps, they just don’t work.

Think back to when you switched from Windows to macOS. Did you notice you stopped minimizing windows?

Why? Because the Genie effect is slow. So you stop using it.

[Raphael Salaja @raphaelsalaja]

the web has been quiet for a while.

for the past few months i've been building something to fix that. declarative audio for the web. describe a sound as plain data, play it with one call.

→ https://t.co/7NjMJFvFqh

[Elon Musk @elonmusk]

True

[DANN© @DannPetty]

Cleaner vectors from ChatGPT Image 2 icons.

30 seconds in Quiver ↓

[Tarun @tarunfy]

Finally the day has arrived.

[Theo - t3.gg @theo]

Zustand is officially more popular than Redux

[Theo - t3.gg @theo]

Zustand is officially more popular than Redux

[Tarun @tarunfy]

Super excited for this!

[Emil Kowalski @emilkowalski]

New lesson for upcoming https://t.co/RP4FIdUrS8 enrollment.

It’s about training your judgement. You’ll see two versions of the same animation, your job is to choose one and explain why it’s better.

A great skill to have when working with coding agents like Claude Code and Codex

[Luke @Lukeedesigner]

Redesigned Gmail, Thoughts?