Shu
2,932 posts
Shu
@shuding
Joined March 2012
- Fade-in animation that is not so boring: { 0% { opacity: 0; filter: brightness(1) blur(20px) } 10% { opacity: 1; filter: brightness(2) blur(10px) } 100% { opacity: 1; filter: brightness(1) blur(0) } }
00:00 
00:00- I made github.com/shuding/cobe a while ago: a 5kB globe lib, and it improved our page performance* by almost 60%. How is it created? Time for a WebGL & shader thread!
00:00 - I deployed it! shu-gallery.vercel.app
00:00
00:23With Next.js’ app directory and that new idea, it takes less than 150 lines of code to create this. ~4 lines are actually related to animation (wrapping the tree with <Satori>): - Statically typed links are coming to @nextjs: ◆ Autocompletion ◆ Error on invalid routes ◆ Prevents 404 links during build ◆ Dynamic, catch-all, and optional catch-all routes ◆ Works with both `pages` and `app` ◆ No extra configuration needed!
00:00 - A 20x faster, realtime Next.js dev experience is coming… (the debug toasts show actual latency figures on our large production codebase)
00:00 - With Next.js’ app directory and that new idea, it takes less than 150 lines of code to create this. ~4 lines are actually related to animation (wrapping the tree with <Satori>):00:00
00:05 - The @vercel dashboard has been growing with new features and more engineers joining the team. How do we keep it fast? Here’s a thread...
- React Wrap Balancer: Simple React Component That Makes Titles More Readable
- There’s a trend of using rotating gradients as input / button borders with CSS. Here’s a neat trick to enhance its appearance:
00:00
