Placeholder Image

Subtitles section Play video

  • So I hope you are ready with energy for the talk.

  • Okay, but if you want a nap, that's fine.

  • I don't have a problem with that.

  • Um, so they're going to look about Web performance.

  • Okay, so I will start presenting myself really quickly.

  • Okay?

  • Maximilian is my name.

  • Max is fine.

  • I'm first on Twitter.

  • I'm a mobile Web developer.

  • So I have been doing what development seems that browser gazing is 1995.

  • So long time ago, using from base, for example, on us we mentioned before.

  • I've been traveling a lot for the Winkle Sultan training 66 countries.

  • This is my first time here in Serbia.

  • So I'm also being doing training for a lot of companies on consulting on.

  • You can find content on training's from me on different providers.

  • Such a lengthy learning people He's known as Linda or safari.

  • I have all for a couple of books.

  • Okay, there is ah, going off a treat there.

  • So because we have original books, these are the regional books, and those are translations on languages that I don't understand.

  • So, um, the last two books are basically on the topic that we will be covering the next 35 minutes.

  • Probably 34 now.

  • So performance.

  • Okay, Web performance.

  • How many of you are currently creating websites or Web apps?

  • Okay, perfect on.

  • How many off?

  • You're great in the fast websites.

  • Okay, Only 10%.

  • And there are a couple of Ah, OK, let's see.

  • We're going to talk about that and how you can hack the web performance, how we can push that even further.

  • That's the whole idea of this talk.

  • So I have two goals for the stock.

  • The 1st 1 is to trigger new tricks that you can start applying in your own websites or Web apps.

  • Presume on the other one is to make you feel bath.

  • Okay about what you're doing right now.

  • So let's start with that.

  • So, um, I know that you know that your users aren't currently not happy on.

  • Probably you're losing money.

  • Okay?

  • You are your customers or your clients are losing money.

  • Why?

  • Because off the performance or because the web is too slow.

  • Your website.

  • It's a slow and sorry to tell you that.

  • So some you quick information about these half a second delay.

  • It's increasing use of frustration by 26%.

  • Okay, that's a lot half effect on delays air reducing Google's traffic.

  • And that's money for Google.

  • Gain terms off ads, for example, 100 milliseconds.

  • Onley DeLay will decrease Amazon sales by 1%.

  • These are all the information.

  • Okay, so there are a lot of information data that you can get on these problems on.

  • I'm pretty sure that you know that today we're not talking about Paige slow as a metric their new metrics of their user centric not about like jobless grape metrics, but about primary uses.

  • Point of view on.

  • We have first meaningful pain.

  • That is, when something meaningful appears on.

  • The patient is not just a line or Bagram color, so something that the user's uses brain is currently parsing the.

  • Then we have first interactive because it's not just you see something on the screen.

  • We should be able to interact with that like, for example, scrawling or touching.

  • So sometimes you see a page, but it's not working.

  • Okay, on officially complete is finally, when you are seeing the actual content that is not pave low on, I'm sure that you're creating your own custom metrics because that's something that it's really important.

  • So what is important for your users?

  • What are you expecting your users to do on your website on your web on then you measure That s o.

  • I know.

  • You know that performance is important on we don't need chance.

  • The metrics We need goals because of how fast is fast.

  • Well, you say all my wife said you slowly in 15 seconds really fast, right?

  • Well, no, really.

  • So we need to set our goes.

  • Currently, the goals in the market are around.

  • These first meaningful pain should be between one and three seconds.

  • So the user is typing the U.

  • R l or clicking on a link on after maximum three seconds.

  • It should be seeing something meaningful on the page.

  • And that means not on your computer and WiFi.

  • That means on any context, including, let's say, low and device with a three j connection will slow three g connection.

  • First Interactive has like one more second to make that country interactive social 2 to 4 seconds.

  • So, um, now you need to think about this on see, how how close are you to these ghosts today?

  • So I know that you're already doing it out of stuff like optimizing the network transfer Such a, for example, enabling she seep on text based fights on your server you're currently working with.

  • The less I need you to be, too.

  • You are using C assistance appetizer.

  • Okay, so we're here in Serbia.

  • Appetizers like a big plate, but typically the appetizer, she'll be small, right?

  • So CIA says she will be a small and you should start with that.

  • So the CSS will be the first thing that you're going to the liver to the browser because he assess will block rendering just small on, um Asadabad.

  • Aye, sir.

  • On toss creeped us dessert at the end.

  • Okay.

  • We need to defer chalice grip as much as possible.

  • So, John, script is your baklava basically.

  • So, uh, you're already optimizing images.

  • You're already creating a great image.

  • Ah, with being g or J.

  • Pay your optimize in that on.

  • You haven't entered the P cash policy.

  • You're currently using service workers, right?

  • Everyone is using service workers, right?

  • Oh, so you should avoid the resurrects.

  • That is when you go to a website.

  • And that website says that we know you know what?

  • No, no, it's not here.

  • You need to go there and you go there.

  • It says, No, it's not here.

  • You need to go there.

  • So, for example, your type of girl on, then first you go to https, which is fine.

  • But when you get there, he says, Oh, you're a mobile phone.

  • No, you two go toe am not.

  • And then you go to m dot and he says, Oh, you want a home patient?

  • You go to end the slash homepage.

  • So all those ready Rex are basically wasting time.

  • So you're not doing that.

  • I already know this is basic where performers techniques that that you're all doing that stuff.

  • What's the problem?

  • The vermin.

  • Even with all those techniques, the average time to load the more by landing based today is 22 seconds.

  • It's really far away from our goes.

  • Okay, so it's really far away.

  • So on is from Google, by the way.

  • So if ah Pei, she's taking more than three seconds to load, more than half of the user will start leaving that patient that time.

  • So you have a losing users.

  • You're losing commercial.

  • You're losing money we're not doing what performance?

  • For the sake of what performance has to to measure with with with your other clothes.

  • We are doing this because off conversion okay, we want conversion in our websites.

  • So that's why we're doing what performance on one of the problem is that we have been always underestimating mobile okay, since the beginning.

  • So for example, today you can say that it's IOS and android, but from a Web point off you, is it safari in chrome on Lee?

  • So the answer is no.

  • So if you if you have tested your website on mobile browsers, it shouldn't be just IOS with safari on chrome, angry with chrome there are a lot of browsers out there something in the browser.

  • You see browser, Oprah Meanie, chrome on IOS the decent actually grown.

  • So these browsers are currently having like a good market share.

  • So more than 3%.

  • That means millions of users that are currently using those rousers.

  • And also we have Facebook that now has a name Facebook Mobile browser.

  • What I'm saying these, when you're the user, is browsing or face one clicking on a link by the fall that link It's not being browsed in the browser, but inside on in a browser that, in a browser is using a different enjoying both in IOS and Android.

  • So have you.

  • Have you ever try your website there?

  • How it looks, I how we worked them to a performance.

  • This is the same mask so far, your chrome.

  • It's not so, um, and it's a lot off.

  • A lot of fuses are currently on that situation.

  • And also when we are talking about the mobile Web that it's more today more than half off our users on some situations that can be 70 and 80% off.

  • Your users on mobile browsers were typical using cellular networks.

  • And I'm not that you're thinking about this.

  • Oh, we have four G now, so we should, um, we don't need to worry about performing.

  • We shouldn't need to worry.

  • But to be honest, if you look at that information that for a couple of months ago, so less than 30% of the users were, why are currently in 40 okay on it's not so much on also.

  • Sometimes when you have your like your lucky for G device, you sir, you're also lucky for G data plan, User.

  • You're also a lucky you, sir.

  • That is currently in the city with four she coverage games.

  • Or like users on that situation 10% of the time, you're downgraded to three g case.

  • What happens?

  • Look, I'm currently in three g here.

  • I'm in roaming.

  • I remember the iPhone 10.

  • I means Reggie S O.

  • That happens a lot.

  • There's no jazz because it's, um, Eastern Europe.

  • I've been in San Francisco, So in the middle of Silicon Valley, I was driving, like, half an hour north, and it wasn't Yuji.

  • Okay, Judy, in the media of Silicon Valley, So that happens a lot with with your users.

  • So you need to be very careful about that when we're talking about three g for G or even five G.

  • Um, typical.

  • Your your brain is thinking about bands with Okay, so it's fast for cheese faster.

  • Yeah, it's faster.

  • But the problem it's not the bath with the problem is the Lady Nancy.

  • So did you think about this?