Short story: `pipeline()` over `.pipe()` and destroy what you create.
Memory management in Node.js streaming applications can be quite complex. Streams don’t inherently protect against memory exhaustion and we get into common pitfalls developers face.
Good luck on non-Apple devices! You may want to try remote hardware or an online service. Or go refurbished and try to keep the cost down.
RSCs in TanStack Start are server-only executed code — perhaps a significant improvement over the Next.js implementation.
This time we get into very smooth starts and stops for infinite animations using CSS. One of the tricks is layering on a transition on top of an animation.
The job is creating dependable applications in production. Not just “a developer who uses LLMs”, but an engineer in a constant evaluation and improvement loop.
We look at designing callout UI elements using CSS, incorporating leader lines and text boxes. It details setting up the HTML structure, utilizing CSS properties like offset-path and borders.
The new No-Vary-Search header can be used to tell browsers that a query string like ?product_id=7 means the content on that URL is unique based on the query parameter, so cache pages like that individually. But also that a query string like ?utm_source=frontendmasters does not have unique content, so don’t cache it individually. (As explained by Harry Roberts)
Creating non-standard shapes on the web, like a speech bubble or a heart have typically required you to cut off your actual borders with
clip-path. […] This is whereborder-shapecomes in. It’s a powerful upcoming CSS primitive that defines a custom shape for an element’s border.
Welp, clip-path() had a good run. I’ll always be fond of tools like Clippy. But border-shape() serves a much more common use case: you want to re-shape an element but not lose the border or box-shadow and whatnot.
Wes Bos has a great short video showing off a use case combining it with the also-mega-powerful shape() function. I was hoping that an element newly-formed via border-shape would automatically have text flow into the new shape, but alas, it does not. If you extend the shape, the text flow ignores it, if you cut into the shape, it just cuts off the text, as if the text were still set in the rectangle of the original element. If you’re clever, though, you can split the shape into left/right halves and use shape-outside to reflow text into the new shape.
Nice 9-minute video from Matt Pocock (from about a year ago) introducing composites. The problem of not being able to compare objects definitely feels worth solving. Or, more accurately, fixing the issue where when compare two objects that look exactly the same, it’s still false. And that using them as keys doesn’t work. Sounds like Records & Tuples were close, but the performance downsides were too strong. Composites are more likely to happen.
const pos1 = Composite({ x: 1, y: 4 });
const pos2 = Composite({ x: 1, y: 4 });
Composite.equal(pos1, pos2); // trueCode language: JavaScript (javascript)Still true if you swap the order of the keys! Looks good to me. I don’t think it’s particularly close to making it into the language, but I see there is still discussion and research going on.
I just blogged about a niche idea for View Transitions. Here are a couple more posts that specifically use the same-page style View Transitions and have a bit more practical demos:
Developer news, information, and advice — right to your feed reader of choice.
RSSHere's our page on guest writing. It's a win-win-win!
Frontend Masters donates to open source projects through thanks.dev and Open Collective, as well as donates to non-profits like The Last Mile, Annie Canons, and Vets Who Code.