Performance & Accessibility

[00:00:00]
>> Optimize for speed. In this game, looking good is great, but speed kills. If your website is less than sub three seconds, and it's slow. And if it's slow people are going to leave it. It is gonna get bad scores on Lighthouse, it is gonna be considered clunky.

[00:00:19]
You're not going to get the desired results if your site is pretty slow. I literally had an experience of that personally a few years ago when I was learning how to code like maybe six seven years ago on the frontend. And my website was gorgeous, but I had an image that was huge.

[00:00:37]
And I had not properly sized it, and it was slowing the whole website down on first paint and I was getting emails from people. You know how slow your website has to be to get emails from people [LAUGH]. Why is this site so slow? And I was, wow, I'll go check on that now, sir.

[00:00:59]
So [LAUGH] that is how like important it is to make sure that website is optimized for speed. Yes.
>> Yep, example about today when you were showing up sample portfolio earlier.
>> Yeah.
>> You clicked away from the first one because it wasn't loading.
>> Yeah, like what's going on, I'm like, nah, I'm going away.

[00:01:18]
So that's a real thing. It's happened to me once, and I still remember cuz I had received three emails from people, like, okay, what's going on here? I was like I'll figure it It out, I don't know. Why you'll calling me, it's lunch go away [LAUGH]. Well, you can't do that.

[00:01:39]
Also you know a great way to do that deliver your stuff over CDN but I do not recommend that unless you're having large complex websites, right? Don't CDN on like your baby SPA, right? It has to be something meaty, all right, before you start doing CDN. And like, before they make sure you have your images render at the right size, make sure that your CSS is minified, make sure that you don't have a bunch of CSS and JavaScript that you're not using in your code base, get rid of all that junk that's not being used.

[00:02:14]
That's why we have version control. If you're not going to use it, don't be that person that has chunks of code come in and out. Just new Git, make a new branch, a new Git flag and put it back in, that's all we have version control, right? So the code that we deleted, we can go find it again if we wanted to, all right?

[00:02:34]
Or maybe even write it better. But yeah, focus on speed. Now this one, use testing. This next one, right after optimize for speed, is use testing. I think this one is only if you're like, not using HTML, CSS, JavaScript. Once you get past that and you're using React, you need to be using testing.

[00:02:54]
It has to be unit testing that's being done. One, that is what a professional would do, right? A professional would not put a website out in the wild that's using framework and not test it, right? That's just not what we do. We want to be employed, right? And to be employed, you have to do things that employed people do, right?

[00:03:16]
They don't put websites out in the wild without tests on them, right? Like that's not what we do, in these streets, all right? So you're gonna be using, so you have to add testing, if you're using React, using XJS, using Angular, Vue. If you're using a backend framework, like Node, or if you're using .NET, you need to be adding tests.

[00:03:38]
If you're making APIs, you're getting tested those APIs, you need to be adding. If you're using API's you need to be adding test to it, right? So you have to be adding a test so that we can see if the API fails in the console, all right? So we have to create the type of vigilance within our products, right?

[00:03:57]
So because that's what a professional does and and it helps the quality of the application.
>> Does Postman count for testing APIs?
>> I'll allow it.
>> [LAUGH]
>> Yes, and no, but I mean, baby steps, we all started somewhere. So it's cool. Accessibility, I have a belief, and a lot of us, I feel like front end is starting to get more towards this.

[00:04:25]
But I have a belief where if a product is not accessible, it is not done. What does that mean? For me, it means making your foreground background text to background stuff is 4 to 1 ratio. Making sure that your website is tabbable, right? If I was to go to, great example would be.

[00:04:56]
I'm here, you see everything that you need to be clickable is tabbable. I can go and press Shift Tab and go backwards. I can tab and go right here. I can press here. Enter, Tab, tab within, go to this Tab. I can escape those tabs by going this way.

[00:05:20]
I have a skip to main link, in case I just don't want to go through any of this stuff, and I can press that to go straight here. That's what I mean by accessible. I wanna make sure that the website is accessible. If it's not accessible, it's not done.

[00:05:35]
So, you have to start thinking about that as a user, as a frontend that accessibility is very important. Around 2018-2019, people were getting sued millions of dollars for not having their website accessible. That started. I remember the first one that we saw came down a pipeline was like 2019.

[00:05:56]
It was Domino's Pizza, they had just been sued for $23 million for ADA violations. Because their website did not have the same accessibility quality as their on-site stores, and we were shook. Everybody was like, my goodness, $23 million. For not having accessibility, they took me off any project I had at work at CBS and they were like your job now is accessibility [LAUGH] for the rest of the year.

[00:06:28]
Brett put me on accessibility tickets for the whole year. And I did them so well I would go down to Jacksonville and talking about the work we had did at our projects, at work, at the HQ for CBS Sports, and they were just like, wow, you did all this work already?

[00:06:49]
I was like, yeah, well, we kinda had to because they were already talking about suing us. So it's very serious and you do not want to be the person who's like why is our accessibility trash after the $160 million lawsuit comes down and we have to fight for this lawyer.

[00:07:07]
You don't wanna be that person. You wanna be the person where I didn't even know this was a problem, but I can fix it. You wanna be that person. So make sure you are using accessibility, right, doing your accessibility best practices.
>> Do you recommend test driven development?

[00:07:22]
>> I don't recommend test driven development, but I do see it's value. I'm one of those people that you should have rules around testing. I know that I don't believe in 100% test coverage. Why are we testing doing test coverage on texts, right? I believe in test coverage on things that are important, or things that are financed or they impact the wellness of the org or the website, right?

[00:07:55]
If it doesn't impact the business or it doesn't impact the website, like a forum or something like that, then I don't believe in testing it, right? So for me, I'm not a big a 100% TDD fan, but I see it as value, and I'm not gonna be like against it as well, right?

[00:08:14]
Test accordingly, it is all I say.