Gökberk nur
@gokberknur.bsky.social
frontend developer
based in stockholm, sweden.
interested in photography, mountain biking, music and web performance.
https://gokberk.se/
based in stockholm, sweden.
interested in photography, mountain biking, music and web performance.
https://gokberk.se/
Reposted by Gökberk nur
Have you been wishing masonry layouts would just hurry up and arrive in CSS?? Well, happy holidays!
webkit.org/blog/17660/i...
webkit.org/blog/17660/i...
Introducing CSS Grid Lanes
It’s here!
webkit.org
December 19, 2025 at 9:33 PM
Have you been wishing masonry layouts would just hurry up and arrive in CSS?? Well, happy holidays!
webkit.org/blog/17660/i...
webkit.org/blog/17660/i...
Reposted by Gökberk nur
Here is my idea with less of code
css-tip.com/tooltip-anch...
The trick is to play with the margin property to show/hide the arrows.
cc @una.im @bram.us
css-tip.com/tooltip-anch...
The trick is to play with the margin property to show/hide the arrows.
cc @una.im @bram.us
October 6, 2025 at 3:33 PM
Here is my idea with less of code
css-tip.com/tooltip-anch...
The trick is to play with the margin property to show/hide the arrows.
cc @una.im @bram.us
css-tip.com/tooltip-anch...
The trick is to play with the margin property to show/hide the arrows.
cc @una.im @bram.us
Reposted by Gökberk nur
⚡Featured posts this week:
✨ How to enrich RUM data in Datadog: @gokberknur.bsky.social
✨ Time to Brand Identity: @duffeh.bsky.social
✨ Core Web Vitals mystery: @tunetheweb.com
✨ Safari Tech Preview now supports INP: Apple
🙏 Special thanks to the authors!
#webperf
✨ How to enrich RUM data in Datadog: @gokberknur.bsky.social
✨ Time to Brand Identity: @duffeh.bsky.social
✨ Core Web Vitals mystery: @tunetheweb.com
✨ Safari Tech Preview now supports INP: Apple
🙏 Special thanks to the authors!
#webperf
October 5, 2025 at 6:27 PM
⚡Featured posts this week:
✨ How to enrich RUM data in Datadog: @gokberknur.bsky.social
✨ Time to Brand Identity: @duffeh.bsky.social
✨ Core Web Vitals mystery: @tunetheweb.com
✨ Safari Tech Preview now supports INP: Apple
🙏 Special thanks to the authors!
#webperf
✨ How to enrich RUM data in Datadog: @gokberknur.bsky.social
✨ Time to Brand Identity: @duffeh.bsky.social
✨ Core Web Vitals mystery: @tunetheweb.com
✨ Safari Tech Preview now supports INP: Apple
🙏 Special thanks to the authors!
#webperf
Reposted by Gökberk nur
Dr. Jane Goodall filmed an interview with Netflix in March 2025 that she understood would only be released after her death.
October 5, 2025 at 9:08 AM
Dr. Jane Goodall filmed an interview with Netflix in March 2025 that she understood would only be released after her death.
Reposted by Gökberk nur
CSS uses a complex algorithm to decide how to animate transforms. If you get it wrong, as many folks do, you end up with an unnatural animation.
Here's how it works, and how to avoid the pitfalls.
jakearchibald.com/2025/animati...
Here's how it works, and how to avoid the pitfalls.
jakearchibald.com/2025/animati...
Animating zooming using CSS: transform order is important… sometimes
How to get the right transform animation.
jakearchibald.com
June 17, 2025 at 11:20 AM
CSS uses a complex algorithm to decide how to animate transforms. If you get it wrong, as many folks do, you end up with an unnatural animation.
Here's how it works, and how to avoid the pitfalls.
jakearchibald.com/2025/animati...
Here's how it works, and how to avoid the pitfalls.
jakearchibald.com/2025/animati...
Reposted by Gökberk nur
January 15, 2025 at 10:19 AM
Reposted by Gökberk nur
Must reads for web developers - how modern browsers work:
1️⃣ bit.ly/browsers-pt1
2️⃣ bit.ly/browsers-pt2
3️⃣ bit.ly/browsers-pt3
4️⃣ bit.ly/browsers-pt4
and browser.engineering a free to read book on the topic
1️⃣ bit.ly/browsers-pt1
2️⃣ bit.ly/browsers-pt2
3️⃣ bit.ly/browsers-pt3
4️⃣ bit.ly/browsers-pt4
and browser.engineering a free to read book on the topic
January 12, 2025 at 11:57 AM
Must reads for web developers - how modern browsers work:
1️⃣ bit.ly/browsers-pt1
2️⃣ bit.ly/browsers-pt2
3️⃣ bit.ly/browsers-pt3
4️⃣ bit.ly/browsers-pt4
and browser.engineering a free to read book on the topic
1️⃣ bit.ly/browsers-pt1
2️⃣ bit.ly/browsers-pt2
3️⃣ bit.ly/browsers-pt3
4️⃣ bit.ly/browsers-pt4
and browser.engineering a free to read book on the topic
Reposted by Gökberk nur
View Transitions Snippets: Getting all Animations linked to a View Transition
🔗 brm.us/view-transit...
🏷️ #ViewTransitions #JavaScript #Animations
🔗 brm.us/view-transit...
🏷️ #ViewTransitions #JavaScript #Animations
View Transitions Snippets: Getting all Animations linked to a View Transition
A few lines of JavaScript to get all animations linked to an active View Transition.
brm.us
January 1, 2025 at 9:14 PM
View Transitions Snippets: Getting all Animations linked to a View Transition
🔗 brm.us/view-transit...
🏷️ #ViewTransitions #JavaScript #Animations
🔗 brm.us/view-transit...
🏷️ #ViewTransitions #JavaScript #Animations
Reposted by Gökberk nur
December 22, 2024 at 11:40 PM
Reposted by Gökberk nur
Animation frames is quite the theme of the year for me 😁. It was fun to record this talk 😀
▶️Check out the talk recording "Long Frames and INP – Understanding the Post Load Performance" by @webx.bsky.social.
Watch it here👇
gitnation.com/contents/lon...
Watch it here👇
gitnation.com/contents/lon...
Long Frames and INP – Understanding the Post Load Performance by Vinicius Dallacqua
Welcome to my talk on long frames and INP, understanding the post-load performance. The rail model introduced in 2015 provides recommendations for responsiveness and organizing JavaScript work around ...
gitnation.com
December 24, 2024 at 3:59 PM
Animation frames is quite the theme of the year for me 😁. It was fun to record this talk 😀
Reposted by Gökberk nur
Web performance calendar day 23 when @webx.bsky.social takes us on a dive into animation frames
calendar.perfplanet.com/2024/what-is...
calendar.perfplanet.com/2024/what-is...
What is an AnimationFrame and what can it tell you?
Modern web applications need to be responsive and smooth, providing users with immediate feedback for their interactions. To understand how our applications perform, we need to understand how browsers...
calendar.perfplanet.com
December 23, 2024 at 7:52 PM
Web performance calendar day 23 when @webx.bsky.social takes us on a dive into animation frames
calendar.perfplanet.com/2024/what-is...
calendar.perfplanet.com/2024/what-is...
Reposted by Gökberk nur
Documentation: "Don't do this. This is a really bad idea."
Developer:
Developer:
a man covering his mouth with his hands and the words watch this on the bottom
Alt: usher putting his hands over his face and saying "watch this"
media.tenor.com
December 11, 2024 at 1:17 AM
Documentation: "Don't do this. This is a really bad idea."
Developer:
Developer:
Reposted by Gökberk nur
Web performance calendar day 9 with @ethangardner.com on how to relate performance efforts to our friends from ads, marketing and the C-level
calendar.perfplanet.com/2024/putting...
calendar.perfplanet.com/2024/putting...
Putting Performance in Relatable Terms
A 300ms improvement may sound like a big win to someone immersed in web performance optimization, but for most people, mentioning milliseconds doesn't usually resonate or seem meaningful. Whenever I'v...
calendar.perfplanet.com
December 9, 2024 at 8:48 PM
Web performance calendar day 9 with @ethangardner.com on how to relate performance efforts to our friends from ads, marketing and the C-level
calendar.perfplanet.com/2024/putting...
calendar.perfplanet.com/2024/putting...
Reposted by Gökberk nur
Fear not, you can have VDOM, hooks and signals for 8.35kb minzipped!
December 7, 2024 at 8:09 AM
Fear not, you can have VDOM, hooks and signals for 8.35kb minzipped!
Reposted by Gökberk nur
After 15+ years of teaching, architecting & delivering CSS for global organisations & startups, I’ve collated that experience into an extensive course.
Complete CSS has taken nearly a year to produce and finally, it’s officially live for a limited Black Friday launch price of £189
complete-css.com
Complete CSS has taken nearly a year to produce and finally, it’s officially live for a limited Black Friday launch price of £189
complete-css.com
November 26, 2024 at 12:01 PM
After 15+ years of teaching, architecting & delivering CSS for global organisations & startups, I’ve collated that experience into an extensive course.
Complete CSS has taken nearly a year to produce and finally, it’s officially live for a limited Black Friday launch price of £189
complete-css.com
Complete CSS has taken nearly a year to produce and finally, it’s officially live for a limited Black Friday launch price of £189
complete-css.com
Reposted by Gökberk nur
I've come to understand what's happening in frontend's decade-long failure to deliver decent user experiences as a sort of epistemic closure. I'm calling it "frameworkism", and the epicenter is now React. Here's a lot of words on why we should all reject it:
infrequently.org/2024/11/if-not-r…
infrequently.org/2024/11/if-not-r…
If Not React, Then What? - Infrequently Noted
Frameworkism is now the dominant creed of today's frontend discourse, and it's bullshit. We owe it to ourselves and to our users to reject dogma and embrace engineering as a discipline that strives to...
infrequently.org
November 30, 2024 at 1:21 AM
I've come to understand what's happening in frontend's decade-long failure to deliver decent user experiences as a sort of epistemic closure. I'm calling it "frameworkism", and the epicenter is now React. Here's a lot of words on why we should all reject it:
infrequently.org/2024/11/if-not-r…
infrequently.org/2024/11/if-not-r…
Reposted by Gökberk nur
My talk from this year's We Love Speed is on YouTube! 👇
In "Tight Mode: how browsers REALLY load web pages", I take a very deep/very nerdy dive into why browsers sometimes intentionally delay loading resources, why they all do it differently, and why they should *stop clowning around* 🤡
#webperf
In "Tight Mode: how browsers REALLY load web pages", I take a very deep/very nerdy dive into why browsers sometimes intentionally delay loading resources, why they all do it differently, and why they should *stop clowning around* 🤡
#webperf
How browsers REALLY load Web pages — Robin Marx
YouTube video by We Love Speed
www.youtube.com
November 26, 2024 at 10:09 AM
My talk from this year's We Love Speed is on YouTube! 👇
In "Tight Mode: how browsers REALLY load web pages", I take a very deep/very nerdy dive into why browsers sometimes intentionally delay loading resources, why they all do it differently, and why they should *stop clowning around* 🤡
#webperf
In "Tight Mode: how browsers REALLY load web pages", I take a very deep/very nerdy dive into why browsers sometimes intentionally delay loading resources, why they all do it differently, and why they should *stop clowning around* 🤡
#webperf
Reposted by Gökberk nur
It's a minor footnote in the trail of prevarications and half-truths that follow React everywhere it goes, but it's pretty incredible that the poster children are *this* bad given 2024 devices and networks:
treo.sh/sitespeed/www.in…
treo.sh/sitespeed/www.ai…
treo.sh/sitespeed/www.in…
treo.sh/sitespeed/www.ai…
November 25, 2024 at 5:00 PM
It's a minor footnote in the trail of prevarications and half-truths that follow React everywhere it goes, but it's pretty incredible that the poster children are *this* bad given 2024 devices and networks:
treo.sh/sitespeed/www.in…
treo.sh/sitespeed/www.ai…
treo.sh/sitespeed/www.in…
treo.sh/sitespeed/www.ai…
Reposted by Gökberk nur
👨🔬 Experiment/Hack: Automatically triggered View Transitions thanks to MutationObserver
Instead of adding `document.startViewTransition` at various places in your JS, this uses a MutationObserver to watch for DOM mutations. When a mutation occurs, it gets undone and then reapplied wrapped in a VT.
Instead of adding `document.startViewTransition` at various places in your JS, this uses a MutationObserver to watch for DOM mutations. When a mutation occurs, it gets undone and then reapplied wrapped in a VT.
You can hack your way into this using MutationObserver.
POC: codepen.io/bramus/pen/z...
The observer undoes mutations like remove, and then reapplies that mutation wrapped in document.startViewTransition.
(This is a remake of codepen.io/bramus/pen/o..., which has View Transition JS intermixed)
POC: codepen.io/bramus/pen/z...
The observer undoes mutations like remove, and then reapplies that mutation wrapped in document.startViewTransition.
(This is a remake of codepen.io/bramus/pen/o..., which has View Transition JS intermixed)
Automatic View Transitions with MutationObserver
...
codepen.io
November 25, 2024 at 9:16 AM
👨🔬 Experiment/Hack: Automatically triggered View Transitions thanks to MutationObserver
Instead of adding `document.startViewTransition` at various places in your JS, this uses a MutationObserver to watch for DOM mutations. When a mutation occurs, it gets undone and then reapplied wrapped in a VT.
Instead of adding `document.startViewTransition` at various places in your JS, this uses a MutationObserver to watch for DOM mutations. When a mutation occurs, it gets undone and then reapplied wrapped in a VT.
Reposted by Gökberk nur
Developers, do you want to verify yourself here but don't have a personal domain? You can use your GitHub account! 🦋🐱
I temporarily renamed myself to @nicolo-ribaudo.github.io :)
I temporarily renamed myself to @nicolo-ribaudo.github.io :)
November 23, 2024 at 4:51 PM
Developers, do you want to verify yourself here but don't have a personal domain? You can use your GitHub account! 🦋🐱
I temporarily renamed myself to @nicolo-ribaudo.github.io :)
I temporarily renamed myself to @nicolo-ribaudo.github.io :)
Reposted by Gökberk nur
(one of) the other side project(s)
a simple tint/shade colour palette generator that
- converts hex (for now) to rgb, hsl, p3-display
- generates
- a colour palette
- CSS custom properties
- Sass variables
- JSON for Style Dictionary
(will also be able to add more than colours)
🙏🖤
a simple tint/shade colour palette generator that
- converts hex (for now) to rgb, hsl, p3-display
- generates
- a colour palette
- CSS custom properties
- Sass variables
- JSON for Style Dictionary
(will also be able to add more than colours)
🙏🖤
November 22, 2024 at 1:08 PM
(one of) the other side project(s)
a simple tint/shade colour palette generator that
- converts hex (for now) to rgb, hsl, p3-display
- generates
- a colour palette
- CSS custom properties
- Sass variables
- JSON for Style Dictionary
(will also be able to add more than colours)
🙏🖤
a simple tint/shade colour palette generator that
- converts hex (for now) to rgb, hsl, p3-display
- generates
- a colour palette
- CSS custom properties
- Sass variables
- JSON for Style Dictionary
(will also be able to add more than colours)
🙏🖤
Reposted by Gökberk nur
The problem with how easy npm makes it to install something (and hide the impact of installing something) is that developers inadvertently end up with huge impactful dep trees. But we can do better!
Hey everyone! I ended my #perfnow talk by asking you all to consider contributing to the broader #webperf community.
And one project I called out was e18e.dev. They're trying to connect together people working on JS packages performance (example below). Please consider joining their discord!
And one project I called out was e18e.dev. They're trying to connect together people working on JS packages performance (example below). Please consider joining their discord!
We're fixing Storybook bloat, one dependency at a time! 🔪 @storybookjs.bsky.social
November 20, 2024 at 6:20 AM
The problem with how easy npm makes it to install something (and hide the impact of installing something) is that developers inadvertently end up with huge impactful dep trees. But we can do better!
Reposted by Gökberk nur
Hey everyone! I ended my #perfnow talk by asking you all to consider contributing to the broader #webperf community.
And one project I called out was e18e.dev. They're trying to connect together people working on JS packages performance (example below). Please consider joining their discord!
And one project I called out was e18e.dev. They're trying to connect together people working on JS packages performance (example below). Please consider joining their discord!
We're fixing Storybook bloat, one dependency at a time! 🔪 @storybookjs.bsky.social
November 19, 2024 at 8:54 PM
Reposted by Gökberk nur
If you ever need to coordinate npm scripts you really should check out Wireit
Wireit is like the missing script runner for npm. It lets you describe script dependencies, inputs, & outputs; then runs scripts & deps in order and caches their output.
github.com/google/wireit
Wireit is like the missing script runner for npm. It lets you describe script dependencies, inputs, & outputs; then runs scripts & deps in order and caches their output.
github.com/google/wireit
GitHub - google/wireit: Wireit upgrades your npm/pnpm/yarn scripts to make them smarter and more efficient.
Wireit upgrades your npm/pnpm/yarn scripts to make them smarter and more efficient. - google/wireit
github.com
November 19, 2024 at 9:54 PM
If you ever need to coordinate npm scripts you really should check out Wireit
Wireit is like the missing script runner for npm. It lets you describe script dependencies, inputs, & outputs; then runs scripts & deps in order and caches their output.
github.com/google/wireit
Wireit is like the missing script runner for npm. It lets you describe script dependencies, inputs, & outputs; then runs scripts & deps in order and caches their output.
github.com/google/wireit