This site reminds me of RockAuto. I've used RockAuto for years and it's great. Probably developed by the same people.

Homedepot need to hire these devs.

Very interesting talk. But it did inform me very little.

Looks like it didn't go stage-3 just yet, but hopefully on the next meeting it will.

?

This is Prev.js!

How's the security though. Had someone pentested this site already and are there even info worth compromising? xD

The day McMaster Carr downgrades to modern UI with double padding on every single element will mark the definite end of the old sensible internet

Impressive 💖

This is huge... Selects have been really annoying to deal with

Simply elegant!!! How mature a site should be to attain that level of optimization..

talk slower buddy

And they are using two subdomains for image resources (images1. and images2.), since browsers have a limit in parallel connections per domain (Chrome is 6, AFAIK). With two domains (two subdomains, I know, but for browsers, they are two different domains), they can load 12 image resources at the same time. Probably using this trick for other resources too.

As a software developer for 7 years, im scared of this

I wish I had this video 3 years ago! Thank you king Wes!

The Keyframers perfected this technique. David Kpiano and Shaw are freaking CSS pioneers.

Critical CSS are we talking about the library? Sure I seen something about it not being great anymore, possibly Harry Robert’s mentioned it this year. I might be way off though.

McMaster Carr is one of my favorite websites. It’s super easy to find the exact fastener you need, and it has CAD files for every part.

PLEASE ACCEPT OUR COOKIE TO WATCH THIS VIDEO

After looking at the website speed, I ordered some sockets from them, they deliver fast ⏩

Clear explanation. thanks man

You need near zero skill to make an website fast on modern infrastructure. You do however need a lot of brainrot to make it slow. That happens to be the case with most web developers. They will learn 10 different frameworks to avoid learning basic Javascript stuff like XMLHttpRequest. Their argument goes, "it is framework, so keeping it compatible with browsers is not my responsibility." I kinda see the point. I have done some moderately advanced canvas stuff, and it is very tedious to figure out why a click event goes through three divs on Firefox but only one on Blink. I might be an amateur, but even OnlyOffice devs who use their custom canvas renderer can't sometimes figure this stuff out. For example, mouseclicks on OnlyOffice UI behave drastically differently between Windows and Linux. However, using a framework rarely fixes these issues.

When you really know how the web works, speed is inevitable. They know.

guys stop visiting the website.. its no longer wicked fast because the server can no longer handles 1.2 millions of you! LOL

SEO specialist is going crazy figuring out where those 1.2 million visitor that are not purchasing nuts and bolts. LOL

I've been using this technique on hero components with background media. It makes sure the component's size is determined by the biggest child, something which required a lot of attention when using position absolute. You don't even need grid-template-areas on the parent, just grid-area on the children is enough. If you're using Tailwind just put something like [grid-area:stacked] on the children and you're done.

reallly good , but firefox and safari does not supports it , it would be better to use a div or p tag and add contenteditable property to them

TOP has brought me here. If you're here because of that too, keep working!

All the youngsters finding out how we made websites in aspx back in the day LOL. Now it's all JS and npm this and that

Wes Bos makes it look so easy and destructs the problem step by step. it makes you like ah why did i not think about that..

Since i learn CSS i have never use absolute position, i have use grid and margin

Nice tip 👍

This is not new in Rails. Turbo ftw.

Is there some easy way to turn this into a typeahead (so user could type something and I could load the options async) or would that be the job for a text input and the new CSS anchoring?

Not the names but the ID-s are unique, of course! And I have a much neater solution.: arr1.forEach( ( aRecord, index) => { aRecord.length = 3; let idValue = aRecord[1]; let arr2_row = arr2.find( ( aRow, index ) => aRow[ 1 ] === idValue) || ["", "", ""]; let arr3_row = arr3.find( ( aRow, index ) => aRow[ 1 ] === idValue) || ["", "", ""]; aRecord = aRecord.concat( arr2_row.slice( 2 ) ); aRecord = aRecord.concat( arr3_row.slice( 2 )); arr1[index] = aRecord; }); console.log(arr1);

Saving this video as well for the code, as well for reference to the cursor

Amazing, just had this issue the other day at work. Thanks!

Oh this was a problem I couldn't solve. Thanks

any idea if this is doable using tailwind?

This is a pleasant surprise. I fully expected net positive stable nuclear fusion before a customizable select.

How can i do this with tailwind

Glad to see jQuery based old fashioned site following all chrome lighthouse suggestions to give tremendous load time.

What monospace font is this? 4:00

This guy definitely used chat gpt to explain the source code and used it in this video. Everyone can be an expert good job

Browser Caching: stores copies of website files, such as HTML pages, CSS stylesheets, images, and other multimedia content, on the user’s computer. This type of caching is controlled by the browser and helps reduce the number of requests made to the server, resulting in faster page load times for repeat visitors. Server Caching: stores copies of frequently requested resources, such as database queries, HTML documents, and images, on the server. This type of caching is administered by the website owner and helps reduce the server load, improving the performance and scalability of the website. Server caching can be further divided into sub-types, including object caching, opcode caching, and Content Delivery Network (CDN) caching. if I had to make a guess they are also in lining all the images since they are not popping in one after another. When we first started making web pages with images the general rule 60kb html and 120kb of images. Then we had js loaders that used low rez images that were replaced with its high rez variants once loaded. Then we had flash and we would stream much of a website as a additional hand rolled cache. Simple fact no one cares anymore. But there so many ways to make web pages fast.

Finally! Hope that it also quickly finds its way to Tailwind.

lol. I get for novelty sake it's cool to see this.. but this is so fuckin overkill and ridiculous. the site looks like shit. u cud get away with a raw html cite and a bit of css and the site would prob be as fast lolol. Request to the server on HOVER is crazy lol

Really glad I got this video recommended by YT. I'd just used another video tutorial to implement flip cards and had to come up with a mathy workaround when I realized they couldn't be dynamically sized by their contents. With significantly less fiddling, your grid stack tip fixed the issue!

It doesn't work for me. When I visited the website, the network sending pre-request is not shown anymore on cursor hovering and when ever I clicked any items, it gave me green loading icon before it goes to the page.

Is this what the spec for selectlist turned into ?