Browsers, Engines, Support and the Other Guys

Monday. Monday. Monday.

Open wide dev fans, get ready to stuff your face with JavaScript, CSS, node modules, barbecue tips, get workflows, breakdancing, soft skill, web development, the hastiest, the craziest, the tastiest web development treats coming again hot. Here is Wes, Barracuda, Boss, and Scott

CSD. Welcome to Syntax.

In this Monday, hasty treat. We're gonna be talking about browsers,

The client, the thing that we use to browse the Internet with. My name is Scott Jalinski. I'm a developer from Denver, Colorado. And with me, as always, is Wes Bos. Hey. I'm excited. We initially called this one the browsers, the other guys. And as I was writing the notes, I was like, maybe we should just change this to being, like, talking about the engines Behind the browsers, like, what is v eight? What is GECKO? What is Blink? What is Chromium? And then talk about, like, those other you know, when you go to, like, can I use? And there's, like, this list of, like, 15 different browsers. You're like, I've actually never heard of that browser. What's going on? We're gonna go through those and be like, would you To worry about those or not.

Yeah. That's a good point. This episode is sponsored by 2 amazing companies, Sentry and Magic Bell. Sentry is the perfect place to see all of your errors and exceptions happen, in just a wonderful interface, but also just a wonderful way to Track how your application or your website or really any web service that you have going is working at any given point. This is a service that I've been personally using for long before since syntax started even. And, I gotta say it's one of my favorite things because It allows me to see exactly anytime I have an issue, it pops up. It allows me to see how many people are being affected by this issue. Not only that, but, like, just how how many occurrences of this issue have taken place in the last given amount of time so that I can see really quickly at a glance. Hey. Is this is this anything that I need? Is this anything that I need to worry about right now, or is this something that I can maybe perhaps Wait for a minute.

You know? I mean, all all all issues are not created equal here. So sometimes Yeah. We have things that we gotta dive into right away, And I just love that Sentry makes it nice and easy to find that. So thank you to Sentry. Head on over to Sentry dot I o. Use the coupon code tasty treat, all lowercase, all one word, and you'll get 2 months for free.

Thank you for Century for sponsoring.

We're also sponsored by Magic Bell. Magic Bell is actually really, really cool.

And I can tell that I like this company because the first item in their, documentation is the spec for actually writing it. So Magic Bell, they're a developer focused company, and they give you notifications for your product. So you need to be able to send notifications, email, push notifications, in app notifications, you name it. You gotta be able to smart use smart notifications. So, like, if somebody is in the app and they get a notification, don't send them a a text message, and don't send them, like, a push notification or don't send them an email. You know, like, that that stuff's really, really complicated. I love how they put it. The Internet's missing spec.

Our notification spec translates to a consistent notification experience across web, mobile, email, and other channels. So You need notifications in your inbox. This is a service that is gonna do it all for you. They even have a React component. You just import this thing.

You can Plop the UI into your application, and it gives you the whole application. You can theme it however you want, and then there's a whole, Set of APIs for actually sending notifications.

Pretty, pretty sweet. Check it out at magicbell.com.

You're gonna get a 100 MAUs, Which is monthly active users. If you use a coupon code syntax FM for 10% off the 1st 12 months. Thank you, Magic Bell, for sponsoring.

Alright. Alright. Let's get on into it. This is different browsers. The other guys, what I thought we would do is Let's just talk real quick about, the big browsers and the engines behind it, because a lot of the other browsers that we're going to be using are sort of Based off of that, we're going to explain it. So the big ones that we have are Chrome, Firefox, Safari, and I don't know Oh, food necessarily. A big one is IE anymore, but IE was a big one at the time. And they're big one. Historically. Yeah. And Those are we call those the big ones because they all have their own engines behind it. Chrome has an engine called Blink. Firefox has an engine called GECKO.

Safari has an engine called WebKit, and IE had an engine called Trident, which is which is dead.

Now they for a long time, they, there was also Edge Edge used Trident for a while, but that was recently switched over. Not recently, a couple of years ago. I think like that before, it was,

like, before it was legit. Yeah. Oh, yeah. Out out. Yeah. Which is good. You don't have to have to really worry about that at all anymore. Yeah. It's funny. I was trying to place the word Gekko the other day. I was I was coming up with all of the engines, and Gekko was just the one that you just don't hear being referenced As much as the engine. For some reason, you know, especially WebKit gets referenced a lot as the engine itself because it's Kind of been at the forefront for so long in many ways. So it's it's interesting. Yeah. Gekko is is the Firefox engine.

And then there's also what we have our did you come up with this term, by the way, cloaked browsers? Yes. I don't I don't know what to call it, but, yeah, it's it. It's a good interface. A really good word for this. Because when I saw it, I was like, oh, that seems reasonable to what you you might actually call these things. So, The way you have defined cloaked browsers or or you what you have called the cloaked browsers are basically browsers that use An engine that's already existing and then build their feature set on top of an existing engine or an existing project.

So you have these browsers that are like Opera, Vivaldi, Edge, and Brave. And there's a newer browser that I've been using called Arc, Which is still on invite only, but it's, probably the my my new favorite browser. So, these browsers, basically, You don't have to worry about having an engine or browser support for these browsers in the same way that you do With Chrome, Firefox, Safari because they use one of those engines, whether it's Arkes on Chromium.

What is opera on? Do you know? Opera. Pretty much

all of them are on on Chromium. Chromium.

Yeah.

Which is interesting because Chromium at one point was was WebKit, and then they moved to Blink. So did all of these then? Well, because Brave wasn't around, Edge wasn't around. But then Opera and Vivaldi at that point, were they on WebKit as well? At the time, Opera had its own engine. So at at the time, Opera was one of the big players,

and you had to you had to test for each of that. Opera actually had quite a good support, And they actually had their own file that would make things like WebKit prefixes work.

But then as many browsers did, they sort of say, you know what? It's not Worth trying to keep up with Chrome.

We're just gonna use the Chrome engine in our own browser, and they sort of ditched their own.

And they said, you know, it because the reason people use Opera was not because, like, oh, this thing is rendering is great, and it's so much faster. Like, that was a big thing at initial in the early days. You switched to Firefox or you switched to Chrome because of the speed and This, the features. But now as browsers are sort of becoming par with a lot of those things, you start to think, okay. Well, I wanna be able to open a tab that's on my phone in my browser, or I wanna be able to share, or I I have, integration with this specific bookmarking service or whatever. And a lot of these browsers spend time on the actual browser experience, the UI, The features, all of that stuff is much more important to people, versus does it render my rounded corners? You know? Yeah. Yeah. Right. Totally.

Yes. Specifically users. Right? But I I think developers are, constantly does this run under my rounded corners? Can we talk about ARC?

Like, what's so good about Arc? You you've been saying, I got an invite. Haven't tried it out yet. What why do you like it? Man, Wes, The fact that you haven't tried it is is deeply upsetting to me because it's it's good.

You know, a lot of times When people come out with new browsers, whether that is Edge or Brave, they or even, like, some of these newer kind of boutique There's a pop up here and there. They don't really feel like the value proposition for them isn't They're not different enough in any meaningful way to pull you away from something like Chrome, right, or or Firefox.

Because, you know, what what's the selling point of Brave? The Brave Brave is like, we're Chrome with cryptocurrency.

Edges, we're Brave, but or we're Chrome, but Microsoft didn't. We added some, like, coupon features in the side navigation.

So it's it's like yeah. I I've been using a lot of these browsers pretty extensively, And Arc is the 1st browser that I've used that actually feels like they took the time to reinvent a browser in many ways. So the biggest thing about it for me is that the whole browser, there's no, like, interface for the browser at by default.

So, like, as in There's no URL tab bar at the very top of the browser when you're browsing the web, but the entire browser is controlled via essentially command palette like you would in Versus code, or Raycast, or any of those types of things where you you pop open a command palette and type. But the coolest thing about it in that regard is that the command palette is, tied to command t. So your muscle memory anytime you wanna make a new tab, you command t and just start typing the same way you would with Chrome. So your full memory is still intact, but it opens a command palette that can do a lot more. You can, like, have split tabs where it splits tabs.

The the whole bookmarking experience is like, tabs there are are thought of in it as a way that's more like, It's hard to explain here. Tabs are are more like sessions or or groups that have been open for a long period of time or could be open and you have end up end up having, like, different spaces of tabs that you have open. So, like, if I if I pin it. Several tabs to different spaces, whether it's level up tutorials or my dev site or any of the resources that I'm using, whether it's my bookkeeping stuff. I have them all open in designated Color coded spaces. And if I do command t and start typing in level up, it doesn't open a new tab. It just takes me right to that previously open section space.

There's like a a there's like a 1,000 little things in this browser that make it really interesting, but It it's hard to express without you getting your hands dirty with it, Wes, because that's why I want I want you to to give it a nice try because there's so many things That they have completely rethought in a web development or in a browsing experience that you'll just say, like,

Man, this is a different take on this. And the take, for the most part, is immaculate. It's incredible. Alright. I'm in. I just Install it while you're talking. It started auto playing some music, so I had to close it, to sign up. Yeah. But pretty sweet. Welcome experience. It's gorgeous.

Their designers and devs are incredible. So next level. So a few clarifications we have here. You're also gonna hear the words v eight, SpiderMonkey, JavaScriptCore, and Chromium thrown around a lot. So the first 3, v eight, SpiderMonkey, and JavaScriptCore, Those are the JavaScript engines within Blink Gecko Webcast. So v eight is a JS engine inside of Blink or Chrome.

And v eight is also famously used in Node.

Js. SpiderMonkey is JavaScript engine in Firefox. JavaScriptCore is the engine of Safari or WebKit.

And so that's why you hear those things. And then you also hear Chromium, and you say, like, what's the difference? You have Chromium, You're saying Blink and then there's Chrome. So Blink is the engine behind Chrome, and Chromium is the open source project. So You can pretty much use Blink and Chromium interchangeably.

Generally, we'll say, like, oh, yeah. These Arc Or Vidalvia or Edge or Chromium based browsers. That means that they took everything as part of Blink, which runs Chrome and just like And forked it or not forked it, but they've they've used that as a base, and then they built their browser on top of that. Yeah. Which it's it's Funny because, is there any way to possibly use

Blink without using Chromium? That's, like, a question I don't know the answer to.

I I would the way I sort of see it is that, like, Blink is the project that encompasses, both the JavaScript engine, the CSS, the DOM, the CSS the CSS rendering engine, the DOM, the graphics engine, all that good stuff.

And then they open source it under the name Chromium.

Mhmm.

Okay. Yeah. So interesting. Kind of interchangeably.

Next week we have here is Sorry, Glenn. I was gonna say I was thinking Chromium was a wrapper just one level up from that. So Oh, yeah. I think they are just interchangeable.

Okay.

Ios browsers.

So if you use whether you use Safari or Chrome or Firefox or Opera or anything on your Ios A device, they are all the engine that runs on them are all WebKit, and that's because Apple does not allow third party browsers to run.

So if you're like, well, this works on Firefox on my computer, but Firefox on my phone doesn't work. The reason is that you're essentially running Safari with A layer on top.

Hoping that will be changed soon. I saw some stuff that Apple will be allowing third party browsers in, which would mean they would literally take Gecko or Blink and run it on the on your device instead of just running a wrapper around WebKit.

There is this whole website, open web advocacy.org, which is, like, basically saying, like, Apple, come on. We need to be able to Run our own browsers, and we need APIs for lower level stuff. We wanna be able to do full screen.

If we need it, we wanna be able to, like, progressive web app. All that stuff that that we're sort of missing from the ecosystem It's

been a huge bummer for a long time, and I'm pretty sure it's it's taken some legal threats and legal action For Apple to even, like, acknowledge it that it is even like a thing. Right? And and anytime you get into these Conversations people will say, well, now is now is the time people are gonna steal your information, and they're gonna do this and that, and it's gonna slow down your phone and whatever.

Man, you You don't have to use Chrome. You don't have to use these other rendering engines if you don't want. Like, let's let's have the choice and option here. It. And that actually to me so you also have Android browsers on here. And for Android browsers, it's always been that way where you can use The the rendering engine based on whatever browser, you want to install. Obviously, there's no Safari on Android, but there is Chrome, Brave, Firefox, many browsers, many, many, many browsers on on Android, and most of which are either skin Chromium or skin something or other.

So you don't have, like, a a ton of crazy different engines or anything like that, but you do end up having a handful of different browsers and different companies feeling like This has been kind of a problem in the Android ecosystem for a long time where, like, Google will put out software, and then Samsung or whoever will say, you know what? We should also just have our own our own skin of this software for some reason just because we wanna have their own skin. And then it either gets behind or they don't support it enough. And that's always kind of been an Android issue overall. But, for the most part, in Android, it feels it's like a Linux based platform, so you can install

any rendering engine you choose. Apparently, Firefox for Android does use Gekko, as a As a rendering engine, so there's that. I we should also say, like, devil's advocate here. The I think that one reason Safari is hesitant about it is, like, battery life. Like, we talk about security. Another one is battery life in that. Like, why don't we have this feature in Ios? It's often because that thing will drain your battery.

And, like, you see this with Versus Code as well, where you can install any any extension you want on Versus Code. And if one of them starts Suck in the battery or suck in your battery life or, taking all your memory or your CPU. People just go, oh, if this code sucks, it's using all All your your memory.

And it's a hard place to be in, because, like, you want to give people full power, but when you give people full power, They'll do things that that break it up. I think we should still have third party browsers as well as those APIs, but that's sort of why the why behind it, I think, as well. Plus Yeah. Tumblr doesn't want you to make an app that you can just freely use in a web browser without having to go through their greedy little 30%

Palms. I think that's really it. In in I mean, the the battery issue, whatever, it's definitely like a thing, but It's not enough of a thing. Yeah. That's not enough of a thing to to to limit entirely.

And to me, personally, it it does seem pretty obvious that, Web applications on the iPhone have been kind of purposefully, I don't know.

Did Defeatured because Stunted? Yeah. Stunted because yeah. If if they're if it's not through the Ios store, or if it is through the Ios store, that 30% cut, it's pretty Pretty dang bag. Right? That's a that's a big old cut that they're gonna be missing out on, and it's classic Apple to do demos. Money in the world For no reason. Yeah. These things are intentional.

Let's talk about the rest of the browser. So you go to Can I Use and you look up A feature on Can I Use, and like, like, container queries? You're going to see all you're going to see a space between the big ones and then all these other ones, Chrome for Android, Opera Mini, Opera Mobile, QQ, Baidu, KaiOS, all of these. And you're like, What? I've never heard of these things. Do I need to worry about them? So let's go through them and explain it real quick, what they are, and do you need to worry about it? So the first one is Samsung Internet. This one comes preinstalled on your Samsung tablets as their own, like a browser. It's very, very Samsung makes Lots of phones, and people use the browsers that comes with their phone.

Luckily, this one runs on Chromium. I think, like, The only thing you need to worry about with these browsers is are these browsers updated as often as Chromium is? Right. Because, Like, if somebody buys a a $40 tablet, they get it for free when they switch their bank account, and then they never update it, That that becomes an issue. Right? So do these things auto update? And for that, you need to just go into your your analytics and see who are my visitors and and what are they on. But, generally, you're in pretty good shape, especially with the Samsung stuff Where they are running a Chromium, you don't have to worry too much about features. Yeah.

Yeah. There's also the Tor browser.

I you know what? I don't know that much about Tor. I know that it's the the dark web. It's this, like, different, network, essentially.

Do you know very much about the Tor browser itself? I would assume it's Chromium based. Right? Yeah. The Tor browser is Chromium based, so nothing to worry about there. But I just put it on there because you will see that sometimes pop up in your analytics. Essentially, it runs it through instead of your browser connecting directly to a server, It will run the requests through a set of set of servers. I don't know what you call that. Like a bunch of different Nodes, prompts, and then so that it comes out so that you can't trace it because it goes through a whole bunch of different nodes.

There's obviously people generally are using that for privacy focused or dark web, deep web type stuff.

Next one we have here is Opera Mini. This is a big one. It's a proxy based browser, and this is generally the ones where people start whining about it. And I'm here to tell you don't generally necessarily have to worry about that because, a proxy browser essentially is they run a service, And the service will fetch the website for you, and then they just, like, squeeze it like like it's a lemon.

They compress it. They moved they removed the stuff that they need, and this is a browser that is used in countries that where connectivity and data is extremely limited.

I even heard that they were doing, like, payday.

Opera got bought, and they were doing, like, predatory payday loan stuff in browsers.

So yeah. I like, here, let's let's Google Opera Payday Loans.

Opera not only to make mediocre browser, but apparently predatory loan apps too.

Wow. So, yeah, some some bizarre Our stuff went through there with with Opera, but, it's essentially just it fetches the browser. This is generally used by people who want to just view content.

There is a JavaScript environment in Opera Mini, and but there is like I wouldn't you can't run an app on Opera Mini. There is some just basic, like, set interval and set time out, though they have limitations.

Your click handlers, event delegation, All those types of things are pretty limited. So generally not something that you have to to worry too too much about, unless, of course, You are building a website where a large part of your audience is viewing that thing. And if that's the case, generally, you're not having a full blown application. It's more of just a website that's been compressed. They they do things that compress images and whatnot as well. That's interesting. I didn't know very I didn't know anything about the Proxy browser thing. Oh, yeah. Yeah. It's kind of interesting about that because, like like, yeah, if you're if you're somewhere where you have, like like, I don't know, half a megabit down or Or like even just a phone line, you know, and you're visiting a website that is for the 4 megs. Mhmm. That's not it. Not possible. It'll take you days to to download that thing. So what this does is it just basically downloads it on a fast server, and then and then serves you up A sort of squeezed down version of that website that is as fast and as small as possible. Interesting.

Next browser on the list is UC Browser, which is basically, you could think of it as Alibaba's web browser.

It's a it's just a very popular browser in China, but Yeah. And they have Android, iOS, BlackBerry. So it's, you know, mobile Mobile browser, but this this one is tough because it's like, do you need to worry about this one or not? Again, it's Going to be Chromium based on Android, and then iOS is gonna be WebKit based.

Again.

Nothing to worry about there. Nothing to worry about. Yeah.

Do you might not wanna say nothing to worry about.

There's there's some definitely, like, weird privacy things with this one. I mean, it's probably not a browser that you're gonna be using anyways. Yeah. Sometimes you have to wonder why are companies making their own browser

And just skinning the existing ones. Right? Totally. Yeah. Yeah.

There's also Opera Mobile.

Opera Mobile is last released at the time recording February 15.

It's a year and a half ago.

Pretty small market share. I don't think a lot of people are really using that anymore. Again, check your stats, but I'm gonna say if you're listening to this podcast, probably you can ignore it. QQ is another Chinese browser.

I I see quite a bit of you seeing QQ come through on my stats. Not quite a bit, but, like, I see it come through. Right? So not not again. There are it's it's WebKit based instead of being Blink based. It's last 1 is 8 month old. So, again, if you have a significant Chinese population, you might wanna be checking that on 8 month old, Safari to make sure that it works or just download QQ.

You're up and running. Then we have Baidu.

That's a discontinued. That was based on Trident, I believe.

Again, nothing to worry about. I I don't know why that's still on can I use? It'd be kind of nice to be able to customize which browsers pop up on Can I Use? Mhmm. Because you see so much red

for a feature and immediately you're like, oh, no way. I would just turn off everyone until the features I wanna use show green. Because I can't see it. So I'm kinda convincing myself that it's okay here.

There you go.

And the last 1, I didn't know what this one was. KaiOS.

That seems to be a gecko, which is a Firefox based browser For Linux feature phones, which is wild.

So, like, I have a friend that still uses one of those feature phones, but, apparently, they can have browsers on them, and that is one of the browsers that it uses. Interesting.

Feature phone. Isn't that a weird Term to call a phone that has no features. Yeah.

That's a good that's a good point. Like, why is it a good point? Feature phone. Yeah. That's my Jerry Seinfeld bit of the day.

That would actually be kind of an interesting thing to do is carry around a feature phone for a month. I don't think I'll do that. I just I don't I do not I do not personally think that would be an interesting thing to do. I remember, like, buying a, like, a, like, a parallel a scuzzy thing to get a ringtone on my old feature phone. Dude, remember the Motorola Rocker, r o k r? Yeah. I didn't have the Rock. I and I have the The

the razor. I had the razor. I didn't have the rocker.

The razor is next level. It it took me a very long time to get A tears for fear's ringtone on my phone. That's you know, it's it was such a weird process, and then you get some weird midi tone. And then I remember the 1st time anybody got, like, audio

Ringtones? You're like, holy cow. Yeah. That was wild. I remember getting, I had another one that was It looked like an iPad, and you could use Itunes to put it on.

That was I remember, like, downloading all this, and, like, those, like, ringtone websites were so sketchy. They were so sketchy. Yeah. And you don't, like, plug in your phone. Yeah. It was it was so weird. Do you know what? They they used to be, like, For for all you youngins out there, it used to be, like, 5 ringtones. You'd get, like, you get your choice of 1 of the 5 ringtones on the phone.

What time would I always said? I always said, my job at I used to work at Pet Supplies Plus, a pet pet supply store in in Michigan. And some lady, her phone started ringing, and I recognized the ringtone as funk.

And I just instinctively I looked over her really quick, and I go, Funk. And she looks at me, and she goes, funk.

Just a random lady at the pet food store. I would, like, think about that all the time. It. Oh, that's amazing. That lady knew what I was talking about. Oh, that's great.

Yeah.

Classic.

I love that. I, In, in university, I changed my ringtone to be this is very Ontario one, but, When you go and buy like a pop at the convenience store in Ontario, you will inevitably get somebody that plays the lotto. Do you have that in the States where you can play the lotto at a convenience store? Yes. Yeah. Yeah. Particularly, like, somewhere in our gas stations. Forever.

And you hear the song, and it goes, winner, which is like Like, that's not how you say winner in French is, but the sound just says gang yonk, like, just butchered.

So now, I put that as my ringtone, and everywhere in public, people would be like, hey.

That's a winner. Gangnam.

Nobody changed their, the ringtone nowadays,

Yeah. No one nobody does ringtones anymore because everyone's got it. Vibrate or they just go with the default one, which is funny because if you do hear a ring in public, everybody checks their phone. Nobody wants your phone to ring in it out loud anymore. I I certainly don't.

No. No. Not at all. It's just just boomers that have it. The volume blast at the 500.

A And then they'll, like, take forever to notice that it's ring. Oh, it's mine that's ringing? Oh, it's mine. The the, like, the Flash, You know that you can go into accessibility and turn on the, like, Flash. Oh my god. It's just going off. Love it.

Alright. So that's All the browsers. Hopefully, that helps you. I would generally say, like like, appreciation for how far we have come because we just went through all of these browsers, and Sort of the consensus is you're pretty good. If there's 3 of them out there, yeah, we complain about Safari every now and then, but, it used to be much, much worse, and there used to be browsers that were 7, 8 years old that we had to support.

Almost no longer the case, which is really, really Cool. One person on Twitter did say that Nintendo DS is running a 15 year old browser, which is unreal. Jeez. What? I mean, Nintendo DS is is, like, 15 years old at this point. So WeChat. Yeah. That's that's unreal. I would think the The Nintendo DS is new. We just got a Nintendo Wii for our our cottage.

What fun? I hacked the thing and I have you can get anything, any game you want. And the kids are playing the bowling and golfing with the Wii. It's so fun. My god. Welcome to 2000.

I was, like, turning it on. 4.

It's it's it's 480p that that it puts out. And I was, like, how did they how did they possibly split 4 Mario Kart races onto 4 80 p, and it still looks decent. You know, here I am complaining about 1,000 pixel websites.

Yeah. I hear you.

Oh, my god. That's it for today. Anything else to add as we wrap it up? Well, let's wrap it. Yeah. No. It's all good. Thanks for tuning in. Peace.

Peace.

Head on over to syntax.fm for a full archive of all of our shows, And don't forget to subscribe in your podcast player or drop a review if you like this show.