@jaffathecake@mastodon.social
@jaffathecake@mastodon.social avatar

jaffathecake

@jaffathecake@mastodon.social

Engineer at Shopify. Once swam to the end of an infinity pool. No thought goes unpublished. 'IMO' implicit. He/him.

This profile is from a federated server and may be incomplete. Browse more on the original instance.

jaffathecake, to random
@jaffathecake@mastodon.social avatar

Can you guess who nearly stabbed himself to death with a stick? Clue:

jaffathecake,
@jaffathecake@mastodon.social avatar

@electric_g nah, this is his (usually very sensible) brother

jaffathecake,
@jaffathecake@mastodon.social avatar

@rachelandrew he's got a little pipe thing fitted to drain fluid, so the suit was a no-go, but we're going to try and switch him onto that on Monday

jaffathecake,
@jaffathecake@mastodon.social avatar

@AmeliaBR we haven't checked the camera yet! Ohh I wonder…

jaffathecake, to random
@jaffathecake@mastodon.social avatar

I'll try to write a blog post about this at some point, but view-transition-name should only be used on elements that are actively involved a page transition, rather than speculatively adding it to everything that might be involved in the transition.

jaffathecake,
@jaffathecake@mastodon.social avatar

For example, if you've got a bunch of thumbnails each leading to a main image' only the clicked thumbnail should be given a view-transition-name, rather than giving each thumbnail a view-transition-name.

The latter looks worse, and performs worse.

https://developer.chrome.com/docs/web-platform/view-transitions/#transitioning-elements-dont-need-to-be-the-same-dom-element

jaffathecake,
@jaffathecake@mastodon.social avatar

@nhoizey SPA view transitions can't be done without JavaScript.

For MPA, I don't see a way to do this without JavaScript. Some methods have been discussed, but none that seem great, yet.

jaffathecake,
@jaffathecake@mastodon.social avatar

@mattwilcox click events work. You could also determine which was clicked from the previous/next URL, and the href of a link.

jaffathecake,
@jaffathecake@mastodon.social avatar

@AmeliaBR @nhoizey the problem is more the transition from main page to thumbnails. In that direction, the click doesn't tell you where the main image should shrink down to.

eeeps, to random
@eeeps@front-end.social avatar

View Transitions Break Incremental Rendering https://ericportis.com/posts/2023/view-transitions-break-incremental-rendering/

jaffathecake,
@jaffathecake@mastodon.social avatar

@eeeps hmm "Cross-document View Transitions render like this" suggests that the browser automatically performs more render-blocking when view transitions are involved. That isn't the case at all.

jaffathecake,
@jaffathecake@mastodon.social avatar

@eeeps browsers already hold back first render to avoid things like a flash of white, hoping to get to a "good" render in a new page. I think that will be good enough in most cases. In fact, in my experience, there are more often cases where you want a transition to pretend that out-of-view elements aren't there.

jaffathecake,
@jaffathecake@mastodon.social avatar

@eeeps a link for that: https://github.com/w3c/csswg-drafts/issues/8282

I'm hoping that transitions will be able to adapt to the content that's there on first render, with minor tweaks for things that are essential. I really hope that isn't "all of the DOM" for pages that are long enough to have a progressive render.

jaffathecake, to random
@jaffathecake@mastodon.social avatar

Just leaned that the intro for the final season of Captain Planet featured a 'rap' by Fred Schneider of The B-52's. I watched it and it ruined my week https://www.youtube.com/watch?v=I-IC3DGubhs

jaffathecake,
@jaffathecake@mastodon.social avatar

@hoodie passing it on

jaffathecake, to random
@jaffathecake@mastodon.social avatar

We put our house on the market. Every day we had a viewing, I woke up to find a massive fox turd on the patio. Once we agreed a sale, no more fox turd. I hate that fox with all my heart. It is my enemy.

jaffathecake,
@jaffathecake@mastodon.social avatar

One morning I thought we got away with it. Then I walked past a bush and it exploded in a cloud of flies and stink. The fucker had not only shat all over the bush, they did it on the day a hosepipe ban came into effect. An evil genius at work.

jaffathecake,
@jaffathecake@mastodon.social avatar

@b2m9 https://www.timeout.com/uk/news/everything-you-need-to-know-about-the-hosepipe-ban-042123

tunetheweb, to random
@tunetheweb@webperf.social avatar

Don’t you just love those Sundays when you suddenly discover that the next day is a bank holiday you didn’t know about?

jaffathecake,
@jaffathecake@mastodon.social avatar

@tunetheweb
"Summer bank holiday"
yesssssss!
"(Scotland)"
boooooo!

kevinpriester, to random
@kevinpriester@mastodon.social avatar

@jaffathecake Wordle Analyzer choke:
Uh oh, one or more of those words isn't in the dictionary: "traid"

jaffathecake,
@jaffathecake@mastodon.social avatar

@kevinpriester well… it isn't 😀. You can't play "traid" on Wordle.

matt, to random

I've done a little looking, but beyond a couple conversations asking for clip-path animations being moved to the compositor (fast-path), I'm not seeing anything solid. Is clip-path a good prop to animate in css in Chrome these days?
@jaffathecake
@Una
@argyleink

jaffathecake,
@jaffathecake@mastodon.social avatar

@matt @Una @argyleink it doesn't yet animate on the compositor (in any browser as far as I'm aware)

jaffathecake,
@jaffathecake@mastodon.social avatar

@argyleink @matt @Una that's worth testing. Last time I looked at it, Safari performed the clipping on the compositor, but couldn't animate on the compositor.

jaffathecake, to random
@jaffathecake@mastodon.social avatar

https://linear-easing-generator.netlify.app/ now has a dark theme, thanks to @argyleink.

linear() is a web platform feature that allows you to create custom easings like bounce, spring, and elastic. Currently supported by Chrome and Firefox.

jaffathecake,
@jaffathecake@mastodon.social avatar

@argyleink If you're currently using JavaScript-based easings, you can import them into the app, and it'll give you the linear() equivalent. The benefit of the linear() versions is they work with CSS, the web animation API, and can run off the main thread. https://bit.ly/453ZGVW.

jaffathecake, to random
@jaffathecake@mastodon.social avatar

I'd noticed Prettier removing redundant parenthesis before, but didn't realise it added them in, in visually ambiguous cases. Nice! https://prettier.io/playground/#N4Igxg9gdgLgprEAuc0DOMAEBDKaDucATpgLyYBsADJgPSYBMmAVJgBQDMmA1JgOwBKANwgANCAgAHGAEt0yUNiJEI+AApKEaZCGwAbfNgCe28QCMi2MAGs4MAMrYAtnAAyMqHGQAzfWjjmljZ29pJWHgDmyDBEAK4BIP5OMtFxCWiRenAAirEQ8D5+CQBWaAAe9pk5eQVIvnr+4gCONXBqKpLaKNhoALSecAAmQ2IgMdgyepEAwhBOTtg6+nqjGVARWQCCMDEyZrHwasTunoUNCQAWME56AOoXMvBoYWBw9lqPMgBuj0Y6YGhTCAvvEAJJQYawexgIgyaSbCH2GBGLJnRogSQqfy3SySHSYuD+IhfLziDxEmDtbARBZohJhIhEnRmbBmOArcSYjwwW4yQYwC7IAAcVHERDgLRk4qpNMWdSK4hgrN5-MFSAY4li-gAKqyuvV0XAnGzBsNBq5cBFYtS4AAxCBEBY7SJLA4QEAAXw9QA

jaffathecake,
@jaffathecake@mastodon.social avatar

@kate innnteresting! Yeah, it feels like it should be consistent here, because folks often assume there's a priority order in both cases.

  • All
  • Subscribed
  • Moderated
  • Favorites
  • •
  • megavids
  • kavyap
  • DreamBathrooms
  • tacticalgear
  • magazineikmin
  • khanakhh
  • everett
  • Youngstown
  • mdbf
  • slotface
  • rosin
  • ethstaker
  • InstantRegret
  • thenastyranch
  • JUstTest
  • ngwrru68w68
  • cisconetworking
  • cubers
  • osvaldo12
  • modclub
  • GTA5RPClips
  • tester
  • Durango
  • provamag3
  • anitta
  • Leos
  • normalnudes
  • lostlight
  • All magazines
    •