Share this page!

Enter URL or ID to Unroll

You can paste full URL like: https://x.com/threadreaderapp/status/1644127596119195649
or just the ID like: 1644127596119195649

How to get URL link on X (Twitter) App

  1. On the Twitter thread, click on or icon on the bottom
  2. Click again on or Share Via icon
  3. Click on Copy Link to Tweet
  4. Paste it above and click "Unroll Thread"!
  5. More info at Twitter Help
Shu Profile picture
Shu
@shuding_
@vercel. @nextjs, @v0, Satori, SWR. Don’t talk unless you can improve the silence.
May 9, 2023 • 4 tweets • 2 min read
There’s a trend of using rotating gradients as input / button borders with CSS. Here’s a neat trick to enhance its appearance: First, here’s a demo that explains how it works: a rotating conic-gradient serves as the background, with an inner overlay that conceals most of it, leaving only the border visible.
Jan 30, 2023 • 5 tweets • 2 min read
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! TypeScript error with hints if you made a typo: Image
Jan 22, 2023 • 4 tweets • 2 min read
Guess I really love CSS and I’m obsessed with the idea of CSS-only challenges. There are some interesting tricks used and someday I’ll write about them...

Here are a few of them: CSS-only interactive blur filter:
Dec 2, 2022 • 10 tweets • 3 min read
Nextra 2.0 is here:
🔹 Redesigned UI
🔹 Image optimization
🔹 Built-in full-text search
🔹 Build-time code highlighting
🔹 MDX v2
🔹 Next SEO
🔹 Multiple docs zones
🔹 Menus and separators
🔹 ...

nextra.site Feature highlights, but there are more! Image
Oct 10, 2022 • 19 tweets • 7 min read
Some tech details and stories behind @vercel’s OG image generation and Satori lib...

There’s been a demand to generate dynamic and fancy OG images for a long time. And we have some solutions but they all seem to be a little “limited”. ...If using a canvas-like (e.g. Skia) based solution, you don’t have fancy/dynamic things like layouts. Also no nice APIs for humans.

With a browser-based solution you get all the fancy things and human-friendly, declarative APIs but too expensive, dev unfriendly :(
Jun 21, 2022 • 16 tweets • 6 min read
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... The result of Vercel’s dash... 1️⃣ Find the bottleneck. 1ms doesn’t really make a difference until it’s executed 1,000 times. So the first thing we did was to identify the hot paths. This will include both JavaScript and HTML/CSS.
Dec 28, 2021 • 18 tweets • 9 min read
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! First of all, today's popular WebGL libs are usually sized at hundreds of kilobytes, but there are also lightweight choices such as github.com/vaneenige/phen… and github.com/xem/W. All of them are wrappers on top of the WebGL standard APIs, but with different feature sets.
May 23, 2020 • 5 tweets • 2 min read
Shower thought 1: I wish we can enable only a subset of CSS properties (strict mode?), which ensures the layout calculation to be one or two passes (one for sizes and one for positions). Most auto layout algorithms (such as iOS Auto Layout and CSS Grid) are kinda unpredictable and unsplittable. They all have this simulation procedure:

constraintsResolved ? finish() : goToStep1()

...like a physics engine. Typography and layout are hard.