733

February 21st, 2024 × #Debugging#Mobile#JavaScript

Egress, scraping, Safari EU changes, is SetInterval worth it?

In this JavaScript and web development podcast episode, Scott and Wes discuss Sentry debugging, changes to iOS browsers, scroll and cursor event interception, accurate timers with setInterval, Chrome extension changes, and inconsistencies with JavaScript's Date API.

or
Topic 0 00:00

Transcript

Scott Tolinski

Oh, I've been better. I am, Not feeling great? Yeah. A little fluy. I I got my my Gatorade right here. I've been pounding it. Just trying to just trying to get back into the the vibe of things. I took, you know, like, a flu and cold last night, so I don't know what is, like, just hangover from the flu and cold because I don't know if you you get that. But I feel good. That in we don't get the good stuff in Canada. I I always hear people people cross the border, and they bring back the

Scott Tolinski

well, just like, I don't think you're allowed to do that. But Yeah. I'm feeling a little off today, but, you know, it could just be that I'm I'm still waking up. But, yeah, I, you might notice ESLint my voice or something. Alright. Well, I'll be I'll be extra

Scott Tolinski

for you. And if you are, off your game, if if your code is sick, like, I'm sick, well, you're gonna be having errors all throughout your application. And here comes Doctor Sentry here to save the day. Doctor Sentry is going to Node only tell you where the bugs are, but, there's even a cool little AI feature that could potentially give you a solution to your bug. And it's pretty neat because I don't know if you do this, Wes, but oftentimes Wes I get a just a a massive dump of errors in my console or something. Oh, of errors. Okay. Yeah. Yes. Of errors. I'll frequently head to, you know, you know, GPT 4 or something, especially if it's, like, really odd, like an odd kind of error, and I'll paste it in there and just say, hey. Can you make sense of this for me? What am I doing here? And usually, it does a pretty good job of finding some of those hard to read ones. And and I think this is what the century tool can do for you just right there in your Sentry, and I think that's pretty pretty sick.

Scott Tolinski

So, sick isn't good sick. Not sick isn't the type of sick I am. If you want to be not sick and have your code not be sick either, head on over to century.i0forward/ syntax.

Topic 1 02:37

Sentry can help diagnose bugs and potentially auto-fix them

Scott Tolinski

Sign up and get 2 months for free.

Scott Tolinski

Yeah. It is interesting. I mean, I think you could even find tutorials online about how to build your own claternary just by dumping things in the s three bucket and putting a function in front of it. As long as you're not using any of the sort of wild features that Cloudinary has and you're just using the general image processing stuff, you should be pretty good to go with those techniques. Cloudinary does have some, like, very interesting image generation types of features. Yeah. Lots of tools. Yeah. It would be hard to replicate, much harder to replicate. But if you're really just, you know, give me automatic quality or give me those types of things, it's a little bit less painful.

Scott Tolinski

Next question here is from Ninja Cat. Ninja Cat says, hot take. I've been a developer for 8 years now, and I always use Macs for development.

Scott Tolinski

Until the last couple of years, I made a switch to Windows due to a company requirement, and I have to say I love it And personally made the switch as well on my personal laptop.

Scott Tolinski

I don't miss it and can do everything the same as I could on my Mac. Yeah. Some things require a few extra steps, and it might be easier to install on the Mac, but it's not a big deal. Plus, it saved me a lot of money not having to pay the Apple tax.

Scott Tolinski

Anyways, I hear people always hating on Windows, and, honestly, it doesn't matter. Get the best computer you can afford and start hacking away. I put this in here Scott because it's it's not a question, obviously, but I think it's dead on. Ninja Cat, you nailed it. You'll often hear us talk about windows on this this podcast in maybe a potentially disparaging way, but it's not because it's not valid to work on a Windows machine.

Scott Tolinski

It's just that, you know, Wes and I prefer to work on a Mac, and we're able to. So we do.

Scott Tolinski

But there's nothing wrong with working in the system that works best for you, because that's the beauty of working on the web. Right? We can use a Linux machine. You could use a Chromebook. You could use anything.

Scott Tolinski

And as long as you can get a text editor, you can get a Node Vercel. Heck. You could even do all of your development in a cloud IDE and leave it on your machine.

Scott Tolinski

So in reality, use the use the computer or the system that you can use. And, Ninja Cat, thank you for for posting this because I I don't wanna I don't want anyone to think that our viewpoint is that you must use Mac, even though we both do, and we say mean things about Windows. The the mean things I feel about Windows personally are due more to, like, the kind of craft that Windows has in the the UI. I feel like they need to just nuke the UI entirely. Like, you'll find pockets of Windows that still use, like, the Windows 98 UI in some places. And you just gotta you just gotta wonder why. You know? So for me, I I don't really love the aesthetic or the general feel of Windows, but it's totally valid. And, especially, it's totally valid to work in as a developer. So, shout out to you, Ninja Cat. Keep on rocking on in the Windows.

Scott Tolinski

Even just like the hardware itself. I like the hardware. I like the design of the hardware. I've never found a trackpad on a Windows laptop that feels like the trackpad on my Mac. And to me, those little little details matter.

Scott Tolinski

But, again, it's development wise, it's, you know, use whatever works. Yeah. And I honestly

Scott Tolinski

Of course. Yeah. I've been using I've been using Apple products since high school. So for me, I I haven't even you know, I have a a Windows machine for gaming at some point, where I did did a Hackintosh for a long time. My my main rig, Wes, was a Hackintosh for several years, where I would dual boot Windows. So it's not like I have no experience there, but I have mostly experience with Mac.

Scott Tolinski

Let's talk more about disparaging things about Yes. Apple now. Yeah.

Topic 2 13:08

European regulations require Apple to allow other browser engines on iOS

Scott Tolinski

Yeah. I think this is even kind of classic Apple too. You know? And it it I I want to have I wanna have give them, you know, the benefit of the doubt here that it is a bug.

Scott Tolinski

But, like, when you look at some of the things that they've been doing around, alternative app stores as well and Node loading, they've they've, you know, they've given in to the regulations that say that they need to do that, but they're doing it in the worst and pettiest possible way that makes it completely not usable or, you know, they're they're charging people an amount still where it makes having a free app into an alternate third party app store undoable.

Scott Tolinski

And I came from Android where you could install anything. You could have third party app stores. It was awesome.

Scott Tolinski

And you can do that on your Mac. I mean, the the Mac itself, if I it complains, it says, hey. This you're trying to install this app from, you know, unverified developer, but you can still do it. And the thing that bugs me the absolute most about Apple is that in their modern operating systems, the the phone, the iPad, even the, VR headset, they all use this intentionally limited operating system to push you into the App Store so they had to get their 30% cut.

Scott Tolinski

And I hate it. I think it's the worst thing that they've ever done. You can't even you can't access the system. You don't have full controller ownership over your machine.

Scott Tolinski

It stinks. So if they do this, if this is in reality Node a bug and it's intentional, I think it is par for the course. And I I'm sick of it with Apple, but I still give them my money all the time. So I don't know.

Scott Tolinski

You know?

Scott Tolinski

Jeez. Okay. Well, that's great. Next question here from Mike. Is there any clear front runner when it comes to monorepo tools? I currently work in a pretty outdated learner setup and am looking to modernize.

Scott Tolinski

I'm familiar with Turborepo and NX, but wondering if there's any standouts. What are your thoughts? Mike, I suggest you just take a look at workspaces in general.

Scott Tolinski

Just about every single package manager these days has the concept of workspaces built in. I tend to like p n p m's and buns the best myself personally.

Scott Tolinski

NPM's workspaces feels a little overdone. Like, there's a little too much config you need compared to the other 2. Like, PNPM's config for workspaces is extremely minimal.

Scott Tolinski

And I would suggest looking at these tools because they're way less heavy handed than something like Lerna, and they're way easier to use. They're integrated directly into your package manager.

Scott Tolinski

And for many people who are working in monorepos, these tools are more than enough. So if you're looking at your monorepo and you're essentially just sharing code between packages like you would typically do in a monorepo or you just wanna keep things connected or you have shared dependencies, man, Workspaces really accomplishes just about everything that I've personally always needed it to do. And I haven't needed to pick up any of the bigger, more powerful tools that have maybe more advanced caching or like, I don't even I don't even know what I would need outside of workspaces. And I I'm sure somebody out there is going to have a more clear idea. So if you use a monorepo that does not work with workspaces, I would love to hear why.

Scott Tolinski

a couple of minutes? A minute? Seconds? They're not even a minute. Yeah. They're they're in the seconds. I don't I would I can't even imagine it getting into the 1 minute, which is why I'm so shocked that, you know, some people are still on Webpack or, you know, any of these tools because, man, when you get into the the Vite world where your builds are seconds, it is really pretty sick.

Topic 3 23:47

Sites intercept scroll and cursor events for performance and convenience

Scott Tolinski

Awesome.

Scott Tolinski

Next question here is from Leonardo.

Scott Tolinski

Hey, guys. Following this podcast for about a year now. Really love listening to you guys on my commute to work. I was recently listening to the Drizzle episode where you also talked about using SQLite as a database, SQLite.

Scott Tolinski

I hope for some reason, Wes, I say MySQL, but I say SQLite instead of SQLite. Why is

Scott Tolinski

I say MySQL, though. Oh, I do say my I say MySQL.

Scott Tolinski

I I say, SQL.

Scott Tolinski

I yeah. Weird how that works. My squeal.

Scott Tolinski

My squeal. Yeah. I am just getting into pocket Bos, which I believe uses SQLite, and I was wondering how scalable this back end JS, and if you guys have tips on moving data and data model from 1 database type to another once you realize that your current database is not the right fit anymore.

Scott Tolinski

For example, I'm moving SQLite to Postgres.

Scott Tolinski

Oh, man. Yeah. So there's a couple of ways you could go about doing this. It it really depends. You Node? Moving from 1 SQL base to another SQL base is a little bit easier than what I was trying to move from Mongo to Postgres.

Scott Tolinski

But, you know, you could you could take, like, a a totally deconstructed approach and take it all back down to something like CSVs and then move those CSVs to one to another, relations and stuff are gonna get kind of tough. I I think the question you need to ask yourself is, like, do you actually need to do that, or do you just, like are you just riding the hype train on something? Because I've I've kinda hit those situations myself where I'm like, I really need a new date. I really need to move my database off of MongoDB.

Scott Tolinski

And, yes, Mongo has its issues. But did I actually need to move my database off of MongoDB? When I sat down and thought about it, no. It's fine.

Scott Tolinski

It's absolutely fine. So is your data situation not fine, or are you just wanting to get on something else? Because I I do think that is a real thing you need to think about.

Scott Tolinski

As far as, like,

Scott Tolinski

Yeah.

Scott Tolinski

And, Wes, there's a one click install on, COOLIFY if you wanna just Oh. Give it a try on Coolify. And So

Scott Tolinski

And if or are you trying to get ahead of some potential issues? What are those issues, and are they serious enough that you need to do it? There's also, you know, tools like tables plus, you know, like GUIs for your database that allow you to export your tables as all kinds of things and restore them as all from all kinds of things. And those tools might be there to to help you, you know, move your database over. But just again, you know, make sure you gotta do it before you do it. It's a headache.

Scott Tolinski

I do. And I use don't. GPT 4 all the time. I use it all the time. I know you use it through Raycast.

Scott Tolinski

I don't know if you're paying for GPT 4, but I I've tried using GPT 3.5 for programming tasks or asking Wes, and I found the answers are significantly worse than what I get on a GPT 4. And the the nice thing is that I can paste in a ton of tote like, a a big old code example and ask it to append it or or work on it or whatever with me or even help me find bugs or comment the code or stuff like that. And it it handles the task very nicely. So is it worth it? I use it all the time. And my wife and I share an account, and she uses it for work tasks. She uses it for emails and things like that.

Scott Tolinski

So, yeah, I think it's worth the cost.

Scott Tolinski

I would say that, like, I would rather pay for that than many other subscriptions that I am currently paying for as well.

Scott Tolinski

It gives me a lot of bad bad,

Scott Tolinski

For coding.

Scott Tolinski

Maybe. That's that's what we say. Hey. You know what? It only Scott, what, like, $20 to try it? Try it for a month. Yeah. You know, that's the whole thing with subscriptions.

Scott Tolinski

Subscriptions become a black hole of spending money if you just keep them running all the time. But, hey, I do this with most of my subscriptions whether that is HBO or any of that stuff.

Scott Tolinski

If there's shows I wanna see on the the subscriptions, I'll subscribe, watch those shows, and then unsubscribe.

Scott Tolinski

There. You've you've pay you've essentially for the cost of a movie or something, you've subscribed to it for 1 month. And, you know, many of these things, the way the subscription works is that you cancel it, and then it still you know, it doesn't prorate your subscription cancellation. What it does is it allows you to complete the end of that month before it actually cuts you off. So what I'll do is I'll say, hey. I wanna use this thing for a month. And instead of having to remind myself a month from now to turn it off, which is a a guaranteed recipe to forget for me, I'll Vercel it immediately after subscribing to it. And then, therefore, at the end of this month, it will automatically cancel on its own. I don't have to think about it.

Scott Tolinski

Yeah. Courtney, sometimes, we'll just we'll be having a meeting, and then there'll just be, like, food coming in from in front of

Topic 4 38:09

Don't use setInterval for accurate timers, use timestamps

Scott Tolinski

decrementing seconds. You'll be in trouble there. Yeah. Word. Next question from Lisa. Love syntax and recommend it to people all the time. Thank you, Lisa. Thank you. That's pretty great of you. I was wondering how you could approach updating dependencies.

Scott Tolinski

Let's say a tutorial works with a previous version of Node. It's an awesome tutorial, so you want to update it. How would you go about updating the dependencies to work with the current version of node? If you are building from scratch, how do you determine what dependencies to use? Thanks so much for your help. Lisa, this is one of those things that gets easier the the more you work with this stuff because you kinda get a feel for what's going to be a pain and what won't be.

Scott Tolinski

Typically, in my experience, going from an older version to a newer version of node hasn't been a problem.

Scott Tolinski

The problems arise when you go from common JS to EJS. That's a big shift if you do that.

Scott Tolinski

The problems arise in ESM. You know, ESM specifically, but the dependencies, bit of it, you know, one thing that I'll do is I'll update my dependencies and then check to make sure the stuff works in a branch and then roll back if it doesn't work. That's a quick quick thing.

Scott Tolinski

If you're using Node, you can use is it NCU?

Scott Tolinski

And the the command is baked into Pnpm ESLint in Yarn.

Scott Tolinski

But all of these package managers by now or with NCU have the ability to interactively update the dependencies based on, you know, if you wanna do the latest versions of everything.

Scott Tolinski

So if it's a tutorial, you know what? It's hard to say because there's some situations where you could update major versions of 10 dependencies, and everything is just gonna work just fine. The APIs didn't really change that much. It didn't touch anything. There's other situations where you were in an old version of React, and now all of a sudden React has changed substantially, and it doesn't support this or that.

Scott Tolinski

Or the dependency has changed in a major way.

Scott Tolinski

This is definitely an area where TypeScript can help because TypeScript will let you know if, like, a particular method no longer exists within a package. Yeah. Or the shape that you pass it has changed? Yes. TypeScript will alert you to those things, and potentially help you guide it. Just know that it could end up being it could end up being a 15 minute project or it could end up being, you know, a 15 day project. Possible. Yeah. Right.

Scott Tolinski

So it's really hard to say.

Scott Tolinski

I would say my advice is to first try to YOLO it and see if it goes well. Do it obviously in a Git branch. Branch off, YOLO it, see how it goes. Yeah. That might give you an idea of which packages specifically have had major changes.

Scott Tolinski

Then if that doesn't work, you can roll back, make another branch, and then update everything without the packages that are breaking. Like, do the the major version updates for everything except for the ones you noticed broke everything.

Scott Tolinski

It's a tough world. I would say Wes you get into the flow, you end up getting really used to it. Now if you're following tutorials, that means you're probably a little bit newer in the in the regard that it might be a little bit tougher for you to be able to manage these things. There is not necessarily a harm in staying with the versions that everything is in the tutorial until you get very comfortable with the tech to feel confident enough to just update stuff.

Scott Tolinski

So, you know, don't always feel like you gotta be on the the latest versions of stuff, And and that's certainly a problem with modern web development where we can just move so quickly. APIs are changing. It's better to have it working than broken,

Topic 5 46:10

Clarification on how Chrome extension changes affect ad blockers

Scott Tolinski

I'll take fault for this because I think I was the one who railed against this. So Alright.

Scott Tolinski

Yeah. They they love the web, but money.

Scott Tolinski

That's that's kinda how my I feel it out. Thanks for thanks for this. Next time we get somebody from the Chrome team on, I would love to to pick their brains deeper on this.

Scott Tolinski

I think antidote.

Scott Tolinski

I don't I don't wanna laugh at you because I say things wrong all the time. But Antidote. An an

Scott Tolinski

I probably got it wrong. I would love to yeah. I might have heard it wrong too. I I guess it's just funny.

Topic 6 49:55

Sharing experience with JavaScript Date inconsistencies

Scott Tolinski

Right now.

Scott Tolinski

By the way, the the API you're thinking about was plain date and plain time.

Scott Tolinski

Plain time and temporal represents the wall clock time that is not associated with a particular date or time zone. Thank you. Temporal, please come Yes. Fast. I I really want this browser in my a p or I really want this browser in my API. Yes. I do. I want this API in my browser for sure.

Scott Tolinski

I do. I have this crazy Vercel miniature little flashlight.

Scott Tolinski

I found this thing as, like, some TikToker saying this flashlight is crazy. It's so bright and little.

Scott Tolinski

And I gotta say, I use this thing all the time. You can find this flashlight cheaper on AliExpress.

Scott Tolinski

Yes. If you wanna just get it from Amazon, it's still $20. It's cheap. This little flashlight is so cool. It's just it's called the bouruit.

Scott Tolinski

I don't know how to say that word.

Scott Tolinski

B o r u I t v ten. They make a couple of more or less powerful ones, and it is very bright. It lights up my whole darn back backyard. It is so very bright.

Scott Tolinski

But I found the utility on it to be really super cool. So there's like a magnet on the bottom. And if you double click the light button, it keeps the light on. I yeah. Their day, I was cleaning out my car. I Sanity it to the, post on the headrest, double click the light. My whole car is brighter than you could possibly imagine on the inside. And I got the I like this thing so much. I got one for my dad and my brother for Christmas.

Scott Tolinski

They're just like cheap little flashlights and, oh, man, rechargeable.

Scott Tolinski

They work super good, and they have a lot of different color modes too. There's, like, even, like, a black light on here. There's, like, an emergency buzzer on it if you you wanna do that. But for for what it is, it packs a really, really powerful bright punch, for the size and capability.

Scott Tolinski

This thing is tiny. Batteries. It fits in fits in your pocket.

Scott Tolinski

of, like, EDC stuff like this. A flashlight is something you need. The I'm so frustrated all the time with the flashlight on my phone. Like, it's Yeah. It sucks. You know? It's okay. That same kind of ease of use. I use it to take out the trash at night or to you know, I gotta go outside to do this or that. Yeah.

Scott Tolinski

Sick. That is a sick pick. My dad was just texting me about it yesterday. He's like, he he at first, when I got it for me, he's like, hey. What's the deal with this flashlight? And I was like, oh, you'll see. It's it's really awesome.

Scott Tolinski

And then he messaged me yesterday saying how much he used it. He's like, have you sick picked this thing before? I was like, I haven't, but thank you for reminding me because I use it just about every day. That's great.

Scott Tolinski

Oh, yeah? Weighted blanket. Yeah.

Scott Tolinski

I use it every single night. Summer, winter, or whatever. I'm I've I gotta have it. Yeah.

Scott Tolinski

Totally. Yeah. Big, big fan.

Share

Play / pause the audio
Minimize / expand the player
Mute / unmute the audio
Seek backward 30 seconds
Seek forward 30 seconds
Increase playback rate
Decrease playback rate
Show / hide this window