Live data from Hacker News

Who has the fastest F1 website (2021)

jakearchibald.com

21–30 of 69 posts

Re: Who has the fastest F1 website (2021)

#21

Earlier quoted context omitted.

And what were the results?

Bad at first until the pattern emerged. Solid colors, sharp lines, is PNG. Photo, 3d, landscape, is JPEG. I'm still trying to hammer it down for juniors who default to JPEG now.

Huh, don't you learn these at school? I learned this in 5-6th grade in my country. Even learned basic HTML and how to create websites with tables... which was when floats were all the rage.

Re: Who has the fastest F1 website (2021)

#23

Earlier quoted context omitted.

Bad at first until the pattern emerged. Solid colors, sharp lines, is PNG. Photo, 3d, landscape, is JPEG. I'm still trying to hammer it down for juniors who default to JPEG now.

Huh, don't you learn these at school? I learned this in 5-6th grade in my country. Even learned basic HTML and how to create websites with tables... which was when floats were all the rage.

Same here. It's not so hard, if your image isn't flat colours and has any "noise" use jpg.

Re: Who has the fastest F1 website (2021)

#24
post #8
post #2

This reminds me of a principle I like: Once you understand your key traits and the key things customers come to you for, it's good to embody them everywhere! F1 is largely about speed. (I fondly remember going to various races as a child with my grandparents, in Melbourne. Everyone seemed in awe of Schumacher). So of course your website should be about speed! This could then apply to everything: ticket turnstiles tha…

This seems reductionist. There's plenty of other reasons people are F1 fans: the spectacle, the wealth, the prestige. While speed is certainly a draw for a lot of fans, speed can be at odds with the some of these other traits. For instance I took my son to qualifying in Miami, and while we both thoroughly enjoyed it, qualifying is quite short, and not nearly as exciting as watching it on TV. My son's first comment wa…

> My son's first comment was: they don't seem as fast in person.

That was the exact opposite of my experience with autoracing. Watching on TV with the long tracking/panning shots seem to reduce the effectiveness of the speed. Standing at the track watching the cars fly by and are only there for a split second really brings home how fast they are. "zoom zoom" is about as close as one can get to describing it. There's also just no way to replicate how loud the cars are either. I've seen Fox try where they have moments where the commentators shut the hell up for a minute, they push the mix from the mics around the track, display Vu like meters on screen with some sort of Dolby/surround type of something suggesting it sounds great in that mode. Don't care. Nothing like being there.

Re: Who has the fastest F1 website (2021)

#25
post #19

Recently I made a small game at work called JPEG or PNG, for the front end team. Bootcamps tend to not focus on image formats at all, the results is all Figma images gets exported as PNGs and bloat the website. Devs often argue that the format is "sharper". Anyway, my game consisted of a slide of images and we vote what's the most appropriate format. When when people got a hang of it, I threw in WebP and SVG. I talk…

My favorite real world example of this was adding a bunch of 2-tone graphics to a website that looked like hand-drawn sketches. The designer insisted they have to be SVG because vector graphics scale better. The SVG was 20MB. The PNG version at huge resolution was 20kB. PNG is really good when you have a few flat colors. SVG is really bad when you have lots of fine detail.

I wonder how much you could have compressed that SVG if you stored the broad strokes and added the perturbations with javascript, after loading.

Re: Who has the fastest F1 website (2021)

#26
post #8

Earlier quoted context omitted.

This seems reductionist. There's plenty of other reasons people are F1 fans: the spectacle, the wealth, the prestige. While speed is certainly a draw for a lot of fans, speed can be at odds with the some of these other traits. For instance I took my son to qualifying in Miami, and while we both thoroughly enjoyed it, qualifying is quite short, and not nearly as exciting as watching it on TV. My son's first comment wa…

I thought F1 was supposed to look a lot faster in person. The cars going at 300kmph don't look so fast on a screen because the camera stabilisation. Someone who makes drones on YouTube collaborated with RedBull to shoot Max Verstappen with a drone at those speeds. And Max was impressed by the perception of speed from the drone footage compared to regular TV broadcast Link to YouTube video: https://www.youtube.com/wat…

Okay, that was a cool video. It's always cool to see how things go wrong and how the challenge was overcome. That has to be a really cool and fun job.

Re: Who has the fastest F1 website (2021)

#27

Recently I made a small game at work called JPEG or PNG, for the front end team. Bootcamps tend to not focus on image formats at all, the results is all Figma images gets exported as PNGs and bloat the website. Devs often argue that the format is "sharper". Anyway, my game consisted of a slide of images and we vote what's the most appropriate format. When when people got a hang of it, I threw in WebP and SVG. I talk…

> Devs often argue that the format is "sharper".

You can also use lossless WebP in place of PNG these days.

Re: Who has the fastest F1 website (2021)

#28
post #5
post #4

Earlier quoted context omitted.

I actually strongly agree with this philosophy because it’s about fostering a certain culture. But as a counterpoint for the sake of argument, money and time spent on optimizing the website could be better spent on the actual race related stuff. So that might be where the optimization is happening. In reality, it’s probably the simpler explanation, that they know how to hire mechanical engineering talent and just see…

The website does not fall under the budget cap, there is plenty of money to go around which cannot be used for racing anyway.

Indeed! Ferrari literally started racing again in Le Mans Series because they didn't want to have engineers sitting around or fire them due to the F1 budget cap. Instead they redirected (very successfully) their additional resources elsewhere.

Re: Who has the fastest F1 website (2021)

#29
post #19

Earlier quoted context omitted.

My favorite real world example of this was adding a bunch of 2-tone graphics to a website that looked like hand-drawn sketches. The designer insisted they have to be SVG because vector graphics scale better. The SVG was 20MB. The PNG version at huge resolution was 20kB. PNG is really good when you have a few flat colors. SVG is really bad when you have lots of fine detail.

I wonder how much you could have compressed that SVG if you stored the broad strokes and added the perturbations with javascript, after loading.

Client side JS will always be slower than letting the browser render the PNG.

Re: Who has the fastest F1 website (2021)

#30
post #19

Recently I made a small game at work called JPEG or PNG, for the front end team. Bootcamps tend to not focus on image formats at all, the results is all Figma images gets exported as PNGs and bloat the website. Devs often argue that the format is "sharper". Anyway, my game consisted of a slide of images and we vote what's the most appropriate format. When when people got a hang of it, I threw in WebP and SVG. I talk…

My favorite real world example of this was adding a bunch of 2-tone graphics to a website that looked like hand-drawn sketches. The designer insisted they have to be SVG because vector graphics scale better. The SVG was 20MB. The PNG version at huge resolution was 20kB. PNG is really good when you have a few flat colors. SVG is really bad when you have lots of fine detail.

Have to wonder what those 20 MB SVGs were like and whether they could've been optimized as SVG still. Doesn't seem to add up that at "huge" resolution that PNG would be that small either.
Post reply on HN