This Month in React, July 2024: State of React, State of JS, React, HTML

Transcript from Thursday August 1st, 2024

[00:00:00] Carl Vitullo: Hello. Thanks for joining us for the July edition of This Month in React, where we recap and digest recent developments in the ever evolving React and web ecosystem. We are coming to you live from Reactiflux, the place for React developers.

[00:00:13] And we actually have a sponsor this month. Woo! First time we're supported by Infinite Red, a consultancy that works exclusively in React Native. They've been around since 2015, have employees on the core team of React Native, and are super great.

[00:00:26] I'm going to do a little more on them after we do introductions, but I am Carl. I'm a staff product developer and freelance community leader here at Reactiflux, where I run community programs and otherwise build tools to keep the community running.

[00:00:39] Mark Erikson: I'm Mark, most of you know me as the guy who does Redux stuff, and as far as day job things go, I am actually looking for a new position, which is a bit of an interesting personal development, so if folks have suggestions for places I should be getting in touch with or that might be interested in me, please ping me and let me know.

[00:00:59] Mo Khazali: And I am Mo. I head the mobile team at Theodo, and I'm an active community member within the React Native ecosystem. I organize the React Native London meetup and soon to be conference, and just contribute here and there, dabble a little bit into open source. Nowhere near as much as Mark does, but I do try.

[00:01:18] Carl Vitullo: Yeah, and a little more on our sponsor. Infinite Red is a expert React Native consultancy. I'm actually uniquely excited to get them specifically, Infinite Red, as a sponsor. They have been around, I've been seeing their name for the entirety of my career since I started in about 2014 with React. And they organize conferences, they host the largest React Native podcast, and generally have just shown up in very real ways to support the ecosystem and the community.

[00:01:46] So I got a chance to connect with one of their founders, Jamon Holmgren at React Conf down in Las Vegas, and we just really vibed. They seem like really great people, they talk about how they are a team of 30 with mostly developers, mostly with more than 10 years of experience, and they work with your team to coach you on how to best use React Native.

[00:02:07] So if your company is looking to build up some React Native expertise, definitely check them out. And thank you, Infinite Red, for sponsoring us.

Job market: FRED data + layoffs.fyi

[00:02:14] Carl Vitullo: Cool. All right. On to some quick hits. Job market updates.

[00:02:18] So there's a new source of data that I'm following, which is amusingly called FRED, an economic data set based out of the St. Louis Fed. So apparently the job site indeed does some like data analytics stuff that now the Federal reserve is relying on for like labor information. And this is a chart of software development job postings that have been posted to Indeed. And it is, indexed off the beginning of 2020. So it's more than doubles at about the start of 2022 and is down to about like 68 percent of that 2020 baseline and it's been pretty flat.

[00:02:57] I really like this because I've been looking at layoffs. fyi for, you know, a year now and it just doesn't quite do it. It is, there's, there's enough, there's a lot of variability. It's only the source of Layoff. So this is kind of the other side. What does hiring look like? And unfortunately, hiring is flat to down, which is not great. But at least people aren't getting laid off as quickly anymore.

[00:03:20] Yeah, speaking of layoffs, layoffs. fyi. This is the first time in, like, the A year and a half that we haven't had a, like, a pop of layoffs at the start of a new quarter. So that's a small positive sign. It's down versus last month in June and only the second time this year that we've had less than 10, 000 developers laid off. So, seems good. Hiring is not ticking up though.

New Releases

[00:03:44] Carl Vitullo: Mark, you want to take us through some new releases?

[00:03:46] Mark Erikson: Sure, a couple of the most interesting ones.

Vitest 2.0

[00:03:48] Mark Erikson: Vitest 2. 0 is out. A bunch of small changes, but it's interesting to note that they're working towards a browser mode. Because we've had browser based testing for a while, but trying to focus on running unit tests in the browser. So, this has some very interesting potential there.

Remix 2.10, fog of war

[00:04:06] Mark Erikson: Remix put out a new release that has a fog of war feature, which looks like it's about trying to optimize downloads of route information. Looks like rather than bundling all the route information ahead of time, they will actually download chunks of it as you go, which should improve loading speed.

Jotai 2.9

[00:04:24] Mark Erikson: Uh, Jotai 2. 9 is out. And it looks like the public behavior is basically the same, but they've reworked the internals.

Storybook 8.2

[00:04:34] Mark Erikson: Storybook 8. 2 has, trying to look at the release notes, a few small changes, probably not a whole lot of big stuff.

[00:04:42] Carl Vitullo: I've never quite understood the niche, the purpose that Storybook really serves. But, you know, hey, minor release, so it seemed worth calling out. I know it's pretty widely used.

[00:04:52]

React Native Reanimated 3.14

[00:04:52] Mark Erikson: React Native Reanimated has 3. 14. So I guess there's your, there's your Pi release.

htmx 2.0

[00:04:59] Mark Erikson: Totally outside of React. HTMX just hit 2. 0.

Mako released

[00:05:03] Mark Erikson: And there is yet another Rust based JavaScript build tool that came out. This one's called Mako. I saw it. I'll be honest. I have no idea how this is any different than the other seemingly like 15 other Rust based build tools at this point.

[00:05:20] Carl Vitullo: Mako has come out of the Ant design. That's what caught my eye as being notable.

[00:05:24] So this is a Rust based developer being built by the team that put together one of the reasonably popular component toolkits. It seems notable for that reason to me. But yeah, yet another Rust based build tool. One more thing on Mako. They put up a bunch of benchmarks that show it being like 10 times faster than Webpack and noticeably faster than RSBuild 0. 6, which is pretty impressive. They also talked about like not being able to get it to work, getting their benchmark to work with the latest release of RSBuild, which is 0. 7. So who's to say if those benchmarks will really hold up, but yeah, cool.

Conferences

React Rally

[00:06:01] Carl Vitullo: Some conferences coming up. We've got React Rally in Salt Lake City, August 12th and 13th. I've been to React Rally a couple of times Over the years and definitely a great one. I also noticed it's pretty much the only conference in August. I think because everyone's on vacation.

[00:06:16] Mark Erikson: React Rally is wonderful. They've done a great job of really having a good community vibe over the years. I should be there. So folks want to come by and say hi, please do.

[00:06:24]

React Universe

[00:06:25] Mo Khazali: Next up. We've got React Universe Conf in Wroclaw in Poland on September 5th and 6th. I actually am seeing this conference. So if you like listening to me talk about weird stuff and ramble, it's the place to be, I guess, but no, it's a great conference.

[00:06:41] It used to be the former React Native EU, and now it's expanding to cover all things React based. And we've got some really good speakers there. So obviously you've got the, the popular React Native speakers that are the lineup of every single React Native community conference that you know, but we've also got folks like Dan Abramov, who's been I can't see Dodds and some others, and I would highly recommend coming to it.

[00:07:03] The organizers really know how to organize conferences. They've done it for many, many years and you're guaranteed pretty much to have a great time.

[00:07:10] Carl Vitullo: Yeah. And on them knowing how to organize a conference, they organized React Conf. They were one of the organizer partners for that. So yeah, they certainly do. They have organized yet another conference. Definitely would love to get up to Poland if I can. Cool.

JSConf Chile

[00:07:23] Carl Vitullo: A, an overlapping conference. There's also a JSConf Chile in Santiago. That's September 5th through 7th.

UtahJS Conf

[00:07:32] Carl Vitullo: There's a Utah JSConf again in Salt Lake City on September 13th. I guess this is. JavaScript versus React for React Rally. But yeah, so we have two conferences in Salt Lake City a month apart.

React Alicante

[00:07:44] Carl Vitullo: There's React Alicante, which is going to, it looks like it's going to be an online conference.

[00:07:49] Mark Erikson: It's in person in Spain and I'm speaking there.

[00:07:53] Carl Vitullo: Cool. Oh, awesome. Wonderful. Go see Mark speak in Spain. That is September 19th through 21st.

JSConf Ireland

[00:08:00] Carl Vitullo: There's also JSConf Ireland in Dublin with also streaming September 25th and 26th.

[00:08:07] And that is all of the conferences we have this month. Uh, I will shout out, last month I mentioned a conference that I will not name again because it came to light that they were using fake speakers on their website and had various people listed as speaking at the conference who were not. So, uh, I updated the transcript, but I wanted to shut that out. I did try to check. I do look at the conference websites and try and vet them, but I got it wrong last month. Sorry.

State of the web surveys

[00:08:32] Carl Vitullo: All right. Onto our main content. We are slightly behind the times by a month or two on State of surveys. There have been a bunch of state of React, state of JavaScript, state of HTML, all kinds of states that have come out over the last two months or so, which is later than I expected.

[00:08:50] Usually these have, in years past, the state of JS surveys have done a pretty good job of coming out. Pretty promptly, they've been running for, it seems like, most of my career. So, just surprised. Seemed like there were some, hitches this year.

[00:09:04] Mark Erikson: Yeah, like, I'm not sure if it was that they, they just took a really long time to analyze the data, or they were working on, I know they did a lot of work on, like, new data visualizations as part of the survey results.

[00:09:14] So, it might just have been that it took them a long time to get the new sites put together.

[00:09:19] Carl Vitullo: I did notice that they had some really cool data interactivity bits on it, like you can, for a lot of, at least on the State of JS site, the State of React one got, looked like a little bit less attention, which is fair, it's a much smaller survey, it's like a third of the size. But, they had some interesting stuff where you could filter or correlate responses. So it's like, Oh, you can see years of experience as it pertains to salary. So there was a lot of really cool data exploration stuff there.

[00:09:48] I did also see a little bit of chatter online or on Twitter about how the survey was promoted and what that means for its sample size and audience. demographics mainly, like the survey responses were like 92 percent male and that's not great. I've seen other spaces get up to like 80 percent male, so, you know, 15 to 20 percent female, which seems to be about the high watermark, unfortunately, for online based tech communities. But yeah, so just, just wanted to shout out that I have heard a little bit of that.

State of HTML

[00:10:21] Carl Vitullo: I'll start with the two smaller surveys.

[00:10:23] So state of HTML was actually really interesting to me. I don't super duper know how to stay on top of, like, HTML and CSS changes, so I feel like every couple of years I, like, see a talk from someone who's a genuine cutting edge expert in CSS and, you know, use the platform kind of stuff and go like, "oh, holy shit, I don't know how to use HTML anymore," because just reading the state of HTML, I found a bunch of little things, a bunch of new features that I was not aware of. I unfortunately didn't take a bunch of notes on them, but just scroll through, see what catches your eye, see what you haven't stayed up to date with.

"Use the platform"

[00:10:58] Mark Erikson: I know we've had, you know, there's, there's kind of the running meme of, you know, the, the folks who insist on use the platform and the, and the React community is a little bit like, "but the platform doesn't support all the things we want to do," but browsers are continuing to implement, new features, the HTML and JavaScript specs keep advancing.

[00:11:17] And it's a fair critique that folks who tend to focus on, the React type front ends probably don't know as much about the nuances of what's available in HTML and CSS as folks who are more focused on that. So, like, there's sort of fair critiques on both sides, and it's worth keeping an eye on, the new advances there.

[00:11:39] Carl Vitullo: Yeah, something that I have thought of many times over my professional career is like, there's use the platform, you know, there's a lot of things you can do without writing JavaScript code. If you can do it with a native feature, it's going to be less development time. It's going to be, it's probably going to be faster, more performant for the user.

[00:11:56] But that use the platform nature is in tension with the flip side of React trying to allow people to write code that runs in more environments. So it's sort of, there's sort of that dichotomy. There's the pressure of writing a tool tip library, writing a modal library that works in React Native as well as natively on the web.

[00:12:16] And if you rely on the platform features, then you can't do the React Native side of things. So There's been a big tension there for many, many years, but I have been very interested in what it would look like if there was a component toolkit that just said like, nope, fuck the other platforms, we're just going to go all in on web, we're going to do it in as few lines of code to get the best user experience and the best developer experience possible.

[00:12:38] I don't know of one that's really working in that way, but I think it would be really cool.

[00:12:42] Mo Khazali: So two points on that, which I think was a really interesting point that you raised, Carl. One is part of the reason why a lot of these libraries don't really work well for React Native is the lack of web API support in the React Native ecosystem.

[00:12:54] And it is actually something that's being worked on. So Microsoft opened an RFC last year and they said, well, you know, we, we, whether we like it or not, as native developers, the web APIs have won. They're becoming standardized. Things are. Relatively stable. So why not try to at least use those as the interfaces, even if the native implementations are different under the hood, so that when you do use your trusty old React library, it does just kind of work out of the box in the React native ecosystem.

[00:13:18] So there is a move towards that and you've got React strict DOM and whatnot. But the example, the counterside to that is the example of tooltips that you mentioned. Like tooltips are not a mobile. Friendly UI element. So there's no easy answer to this unless you create really high level primitives that are UI agnostic.

[00:13:35] But functionality wise, they kind of behave similarly. So, you know, from a way that it looks, it's totally different on iOS, Android, and web, but at least the APIs for the developers are the same. So opens a tool tip on the, the, the web with a hover, but you know, maybe opens up a modal. A bottom sheet modal on native.

[00:13:52] So it's a big point of contention for us React Native developers that we're trying to figure out. I don't think we have the answer, and I don't think anyone's figured out the sweet spot. But we'll get there. We will get there.

[00:14:02] Carl Vitullo: Yeah, I feel like it crosses my mind every couple of months, but just hearing you talk about like, the web platform just makes me think yet again of a 2013 talk called the birth and death of JavaScript.

Birth and Death of Javascript

[00:14:13] Carl Vitullo: And yes, JavaScript is intentional. But yeah, if you are not familiar with JavaScript. That birth and death of JavaScript talk, watch it because like, oh my God, it's the most, it has remained the most like prescient talk I've ever watched. It is exactly discussing how JavaScript takes over the world and we're just living it, we're just living that 10 years later, 11 years later. Anyway, that's a, that's all kind of long diversion for state of HTML, but.

State of React

[00:14:39] Carl Vitullo: There was also a state of React survey. It was pretty good. I kind of got more interesting signal I felt out of the state of JavaScript survey. There was a lot of survey time dedicated to like, what React features do you use? And that's just not really a question that I have, you know, I don't really care if you use, you know, use context. You probably do. If you don't, you probably should. That section, what features do you use, is interesting in terms of like, what are people aware of, but I don't know that it really changes that much.

Component Libraries

[00:15:07] Carl Vitullo: It did have a lot of good data about component libraries and ecosystem that I thought was, just, we, we spend so much time in here bantering about like, what the vibes are and how does it feel What tools does it feel like people are using more and talking about more?

[00:15:23] So this is a good data based check in on how accurate the, the vibes, our read of the vibes are and pretty accurate. I'm pretty happy. We'll get more into it with the state of JS, just that did have a lot more of the vibes, but some things I thought were notable component libraries, generally not popular.

[00:15:40] Some of them are reasonably widely used, but like not loved. Radix were the most loved with Headless UI, also pretty high up there. Radix and Headless UI are not ones that live large in my mind, so it was cool to see those surfaced. Definitely, like, you know, obviously we talk about ShadCN pretty frequently, but Redux and Headless UI, good ones to check out.

[00:16:03] Headless UI looks cool because it's unstyled, so it's just behavior, and then you make it look the way you want. Which, here for it, love it.

[00:16:11] Mo Khazali: I think that's kind of the direction that they're all going with as well. Like, you know, R a bit more opinionated, but still flexible in a lot of ways compared to, let's say, your run of the mill material UI.

[00:16:21] I think that's the general direction where these things are going. And Headless is great for that. I guess that's the appeal with Shad for me as well, right? Like I know a lot of people love ShadCN. The appeal is, well, if you don't like the rounded corners specifically, it's just a tailwind prop to change and you're kind of done.

[00:16:36] So you have a lot of flexibility there.

[00:16:38] Carl Vitullo: Yeah, definitely makes sense. It's been curious to see how slowly that has evolved over the years. I, I bailed out pretty quick on component toolkits cause I just, I don't want it to look like a bootstrap site.

StyledComponents still big

[00:16:48] Carl Vitullo: So there was also something that I found interesting just because it seemed like a, you know, narrative violation is styled components are still pretty dominant in terms of actual usage, like enormously widely used, you know, everyone talks aboutTailwind and whatever, but. Style of components, they're here to stay, they're sticking around.

[00:17:05] Some other interesting data, 23 percent of respondents are still on either React 16 or 17. So this is like, how many years after 18 was released? And 6 percent of survey respondents don't know what version they use, which is interesting to me.

[00:17:21] So, yeah. If you're using React 18, congrats, you are on the cutting edge. The only 68%, less than 70 percent of survey respondents are on React 18. Talking about nobody uses beta versions. Nobody uses advanced versions. I think it was like less than 1 percent have tried a canary. So rounding error. All right.

State of JS

[00:17:43] Carl Vitullo: State of JS, the big one. Mo, you want to, you want to kick us off with your thoughts? Break up my monologue.

A Note on Survey Sample

[00:17:48] Mo Khazali: Sure. Good to start off with what you kind of start off generically about the survey results, which is you got to look at the sample size.

[00:17:53] It's like the most important thing to do when you start with this, because it makes the data seem a lot more contextualized as a result. So a colleague of mine, she was talking about this and I kind of took notes and then looked through it and I was like, yeah, wow, that's very accurate. She was giving me her thoughts.

[00:18:09] But the first thing is, location is heavily US based. So if you look at the respondents, 16 17 percent are from the US. If you combine Germany, France, and the UK, Those become close to the US respondents. They're about the same as the US respondents, a little bit more. So all of this data is heavily skewed by the US market.

[00:18:25] Things like, let's say like the Indian developer community is very, very underrepresented. There was only about 500 respondents where that's about two, 3%. Whereas, you know, they should be a lot more because proportionately they'll have a larger developer community than that, which is represented.

[00:18:41] Carl Vitullo: I think the total number of respondents was like 20 or 30, 000.

[00:18:44] So hearing only 500 from India is like a little bit shocking. Yeah,

[00:18:47] Mo Khazali: it's, it's quite poorly represented. Or the Netherlands, as an example, has got about 500 as well. The Netherlands is a big tech hub in Europe. A lot of big tech conferences happen, JavaScript conferences happen in the Netherlands because there's already a big community there.

[00:19:00] So it's very interesting, I think it's probably more to do with marketing and how they got the word out, and which communities it goes to. And so when you have location being heavily based in the US, then it skews salaries quite significantly. US salaries for developers are much higher. than European salaries And so all of the salary data is being taken on sort of an average, and so that moves the whole scale, basically.

[00:19:20] The other thing which kind of you hinted on, Carl, was it's almost exclusively male. So 94 percent men, which isn't great. It's really heavily, disproportionately male. Men who have responded to this. And then the worst view that you can see, and this should, if anyone has any doubts about this, just look at this view and hopefully your doubts will be completely gone but when you combine the gender and the yearly income views, you can see that men have a higher average salary.

[00:19:47] Shocker. So the gender pay gap is very much there, and it's something to the degree of 20, 000 on average between men and women. Shocking, right? And unfortunately as well, again, racial demographic, it's mostly white respondents, 70 plus percent as well.

[00:20:02] So there's, there's, the sample size isn't very representative, I'd say. Still interesting findings, but just those caveats are very interesting to contextualize everything.

[00:20:10] Carl Vitullo: Definitely. Yeah. It's funny. The salary to gender is one of the only things I did to play with the data. So it's funny that we both went straight for that. Yeah. Also on salary on, you know, US based salary, skewing it, you know, higher, I actually was, looking at that chart, looking at the, you know, the, the quartiles and seeing that my last job, like two years ago, my last full time software tech job was like, On the very high end of that.

[00:20:36] So it's like, Oh, apparently I kind of maxed out the scale, which is interesting because I definitely have not, I was not at the top of the scale. I, my last salary is 171, 000. Like it was good. I was very happy with it, but. I know plenty of people who are making like double that. So I was surprised as much as US salaries will skew it higher, I was a little surprised to see the absolute high end of the scale, not really represented. Do you know, just knowing people who are making that.

[00:21:04] Mo Khazali: So. Fascinating. You know, you say that because again, it's relative because if you, let's say like, look at the UK, 170, 000 per year, and your yearly salary is basically the top, top, top end, like maybe top two, 3 percent of developers. in the UK. So it's, it's all relative.

[00:21:18] Like, like you say, yes, even in the U. S. you can go much higher and then it starts to become really skewed. So yeah, very interesting, but the data is never going to be accurate.

[00:21:26] Carl Vitullo: Right, right, right. Yeah, I think top of market, I don't know, Netflix intentionally tries to pay top of market. I think they're in like 350 range.

[00:21:33] I've heard rumors, consider this a rumor, but I've heard of like super top developers at OpenAI making upwards of like seven, eight, nine hundred k, a million dollars a year salary. So yeah, high end of the scale is crazy in the US, but we can, we can bail out of demographics for a minute.

[00:21:52] I'm going to just rapid fire some of these, some of the breakdowns, some of the analysis that I was looking at.

Vue Tops Angular for usage

[00:21:57] Carl Vitullo: Vue has surpassed Angular by usage according to this survey, which caveats about sample aside is interesting. Angular definitely not loved. It had a like net unfavorable view of it. I think majority of respondents had a negative view of it. it's still in competition with Vue and React by usage, but it is substantially more negative than either of those, than either React or Vue.

[00:22:22] Everyone still loves Svelte. It was number one by like a long shot on interest and favorability rating, but not very top by actual usage. It has been consistently, growing in usage over the years. So React is still generally positive. It's still the most positive by rank. You know, in this list, it was number one most positive, but that's been declining over the last two or three years and is very tight with Svelte right now.

[00:22:49] The dots were like practically overlapping, like definitely within margin of error for which one was more positive. Astro topped out the list of other options, It did not make the cut to be in the main list, but one of the shout out, Astro is in contention. it was funny.

Developer Happiness

[00:23:05] Carl Vitullo: The, they had a chart of happiness and generally all of the libraries people were happiest in 2018, which I just thought was funny because I tend to think of 2018 as like peak tech for, in a lot of different ways.

[00:23:18] Like when I think of Reactiflux and its activity and its growth and its vibes. 2018 was definitely a banner year. So that seems to just generally be true across the industry. Everyone was happy in 2018 and people are less happy now.

[00:23:31] Next usage has been growing pretty consistently for like the last four or five years by this survey. Remix has been pretty flat, which I put them in the same usage bucket. I put them in the same popularity bucket in my mind. So that was a little surprising to me. There's also, Remix had a much more negative perception than I expected. It's about even for, you know, positive and negative responses.

[00:23:52] I love it. I thought it was great. So I'm just surprised to see that. Over the last, like, three years, testing, usage of test tools. has grown pretty significantly, whether it's Jest, or VTest, or Playwright, or Cypress. All of them saw usage go way up in the last two to three years, which is very funny because that, that tracks very well with my experience of three to four years ago, nobody was writing tests.

[00:24:17] Just, people actually started writing tests in the last couple of years, which is funny. Yeah, Playwright versus Cypress. The vibes are supported by the data. People love Playwright. It's got really great retention. It's got really great net favorability rating. Cypress, a little bit less so. It's still very widely used, but the retention chart was much more negative.

[00:24:39] And it's just not as well loved, which generally tracks with the sentiment that I've seen.

[00:24:44] Mark Erikson: Yeah, I think I saw that Playwright Downloads had recently surpassed Cyprus's. I know I've seen a lot of mentions of companies migrating from Cyprus to Playwright. So, yeah, matches my experience.

[00:24:55] Mo Khazali: We literally, this week, migrated one of our clients from Cyprus to Playwright.

[00:25:01] So, another anecdote of how the general vibes are going in the community.

[00:25:05] Carl Vitullo: Yeah, Roboto just asked in the chat, what are people's problems with Cypress? I've run into a bunch of weirdness on flaky tests and just general quirks, like the edges have been rough. I haven't really done enough with Playwright to say what's better about it, but it seems like it's based on a more stable foundation.

[00:25:24] Mark Erikson: I can briefly speak to this. Cypress runs your entire test in the browser. It basically kind of like hijacks everything about the browser behavior and sort of re implements a lot of that itself. Whereas Playwright, the test is running externally. And it's sending, like, DevTools protocol commands to the browser.

[00:25:42] CypressR also has a really weird not actually async model. The way I understand it is it actually runs through the entire test code ahead of time and collects a queued list of commands, and then it executes those later. So you can't even use, like, real async await in your test syntax, whereas with PlayWrite you can.

[00:26:03] Carl Vitullo: Interesting. Yeah, because I think Cypress came out before, like, headless Chrome was a thing, because I remember they, all of the browser automation stuff from, you know, years gone by are very hacky. Like, they're scripting the browser in a just really janky way, and the browsers produced a headless variant that is more intentionally able to be scripted.

[00:26:26] And so I'm pretty sure that Cypress predates that change, and so they had to do the hacky weird stuff, and Playwright came about after that change, and they do less hacky weird stuff.

[00:26:36] Mo Khazali: There's one more thing with the Cypress, I guess, model that pushed people away in the last couple of years, which was that they basically, they, I believe they're VC backed.

[00:26:46] They needed to find a path towards monetization. So they released a paid model where you had a dashboard on their sort of like hosted platform. And then there was free alternatives. And they were scanning your node modules. There was this thing that came up where they were scanning node modules and sort of sabotaging if you were trying to use an open source alternative to their paid platform, which people really did not like.

[00:27:09] And there was a lot of backlash. So I think a lot of people lost a lot of trust with Cypress as well after that.

[00:27:13] Carl Vitullo: That tracks. Okay. That's not great. Yep. Also in testing, the generically branded testing library is also losing ground, which I'm surprised by. I loved it. I thought it hit a really great niche between like unit tests and full end to end tests.

[00:27:28] But I guess my thought is maybe. Playwright is now stable enough to cover that use case with less setup process. Cause it did take quite a bit of work and influenced how I developed features when I had testing library tests in place. So maybe it's a similar benefit for less work using Playwright instead of testing library.

[00:27:49] Mark Erikson: It is worth noting that Playwright actually added testing library inspired APIs like get by test.

[00:27:56] Mo Khazali: And I have another hypothesis to this, which is again anecdotal, but it's from working with many different sort of clients. I think it might also be market led, and the reason I say that is because end to end tests are much easier to sell to your business stakeholders.

[00:28:10] Oh, we're running and executing the full end to end lifecycle as if it was a user, and it helps prevent bugs because you can see when a flow, a major flow is broken. Whereas Component tests, whether they're with React testing library or any other solution or unit tests, are much smaller pieces of the segment.

[00:28:26] And I think when you're crunched for budget, but you still want to have some level of testing and confidence as a business stakeholder, you'll push your developers to do more end to end tests because they understand it more. That's my hypothesis. I've seen it more in conversations with some of the leaders and the companies that we've been working with.

[00:28:40] Carl Vitullo: Yeah, that makes sense. I personally find that a benefit because it'll, testing library lets me sidestep the whole, a whole set of questions. Like how do I log in? So weird stuff like that gets easier if you strip away the, you know, the stuff surrounding the feature you want to test. And once you've just run through the interactions there, but it definitely would be easier to sell.

[00:29:01] We're going to test the whole thing. All right. Many diversions later. So testing, State of JS. Vitest usage has really skyrocketed. It's been very impressive. Jest is still surprisingly well loved to me. Generally testing across the board, way up. Everyone is writing more tests. Moving out of tests into native.

[00:29:20] There's generally, it looks like a lot more people are building native code. This is probably a reflection of how much work the React Native and Expo teams have done to make that feasible for people who are use, who are coming at it from web development. Like in the, you know, different runtime section of this, they had, are you using, Electron, Expo, Cordova, React Native, all sorts of things, including native mobile.

[00:29:48] You know, just, are you building a native app? All of those are, well, all the modern popular options are way up. You know, Cordova is, you know, Declining, luckily, but React Native, Native Mobile, all of that is trending pretty way up.

[00:30:02] One option that was brand new to me in this survey is Tauri. Looked like an option that people love for doing native stuff and wanted to shout it out.

[00:30:11] Mark Erikson: Yeah, and for those who aren't familiar with it, Tauri is basically a competitor to Electron. You know, the idea is you're writing a web app that runs it runs within the desktop as a native like application.

[00:30:22] The distinction being that with Electron, you're having to ship an entire separate standalone copy of Chrome to run your web app, whereas Tauri wraps whatever the native web view is for that platform. So, you're only shipping, say, like, A five meg set of assets instead of, you know, 150 megs of Chrome to run your couple of megs of JavaScript.

[00:30:45] Mo Khazali: And just from a native app developer's purist perspective, I would, from a React natives perspective would say that's not really your native, but it's a good hybrid option, but that is just a personal thing because you're not rendering native views at the end of the day. You're rendering a web app with some connections onto the native layer APIs.

[00:31:02] But that's generally the challenge with anything like Electron, Ionic, Capacitor, or Tauri.

[00:31:08] Carl Vitullo: Yep. Into like bundling and those tools, Webpack declining sharply. Really bad compared to others, like favorability and retention and all of that. Unfortunately, the way the questions are asked is, What have you used?

[00:31:23] So there, it doesn't have a way of capturing What people currently use versus what they have used and have switched off. So it's hard to say whether people are actually not using Webpack anymore or, and whether they've added new tools to their toolkit or whether they've replaced it, that is not a question that we can answer with this dataset.

[00:31:42] My, my intuition, my guess here would be that a lot of people are still using Webpack professionally, still working on a project that was spun up, you know, over the last two to five years. And, you know, switching bundlers is a really challenging project with not a lot of business value. So, yeah, I, I, it would not surprise me if a lot of people are still using Webpack at work, but have stopped relying on it for projects they make on their own or for, you know, open source work.

[00:32:10] Mark Erikson: Also worth noting on that, on that front, that, Create React app. There's still plenty of CRA apps out there, even though it's no longer officially maintained or recommended, and that has always used Webpack internally. And Next is still a Webpack wrapper. They've been working on TurboPack, which I think now fully supports dev mode, but I don't think it supports production builds yet.

[00:32:33] So, Next is still wrapping around Webpack for the foreseeable future.

[00:32:38] Carl Vitullo: Yeah, generally, like, ESBuild and Vite have been the big winners here as Webpack is losing usage. Rollup is going up as well a little bit, but as far as I know, that's largely used by library maintainers, not app developers. Yeah, monorepo awareness is also growing a lot.

[00:32:55] You know, the classics from, like, Several years ago where Yarn Workspaces and Lerna, those are declining. They are not the popular options anymore, but NX and PMPM are currently the leaders there, although I'm not sure if people would answer, I'm, I'm, I'm wondering if people might've said, Oh yeah, I use PMPM when they didn't mean they use it for monorepos, that's not the primary use of PMPM as far as I know.

[00:33:18] And TurboRepo from. Vercel is also growing, but for other runtimes, Bun is slightly more popular than Deno. Interesting to check in on.

[00:33:27] Mark Erikson: Now, is that, is that in sentiment or like actual usage amounts that we know of?

[00:33:33] Carl Vitullo: That was claimed usage. So people saying, yes, I have used this. More people said that for Bun.

[00:33:39] But, who's to say if it was personal, who's to say if it was professional, playing with something is very different from introducing it in a work setting, and my intuition says that Deno is currently better positioned than Bunn to be used at work, which is a much stickier usage. Yeah, another fun stat that I caught and wanted to shout out.

[00:33:57] 18 percent of respondents have not used any AI tools. You know, whether that's Copilot or ChatGPT or Claude. Yeah, 1 in 5 of tech people who are aware enough of the online Zeitgeist to respond to a survey have not used it at all.

[00:34:14] Mo Khazali: Just another interesting fun one. Apparently, 50 percent of respondents are still using Lodash actively, which I found was interesting, but more interesting than that is the 33 percent that still use Moment, despite some of those APIs basically being available in the, in the browser APIs.

[00:34:29] So, takes a long time to get rid of some third party libraries, it seems.

[00:34:32] Carl Vitullo: Yeah, yeah, it really does. Yeah, and I wanted to shout out the 20 percent of people who responded that are still hoping for, a pipe operator and pattern matching. My heart goes out to you as one of you.

[00:34:44] I, that's something, those are two features that I got really excited about and like. 2015 16 that we are still waiting for. So I think I'm, I think I've given up at this point. Yeah. And Mo, about, uh, on library usage, I was really surprised to see that RxJS had a lot of usage. I think of it as a niche library, but, but by survey responses, a surprisingly large number of people are making use of it.

[00:35:09] Mo Khazali: That's quite interesting. I mean, the, the, the one that everyone makes jokes about is jQuery as well, which is 22 percent still, but you know, yeah, it's, it's, RxJS has always been more niche and I'm, I think it was mainly used predominantly by the Angular community, if I'm not mistaken, right? Someone from the, uh, from the comments is saying that it's still a first class tool in Angular, so that, that might check out as to why it's got such a high usage.

[00:35:31] Carl Vitullo: Okay, that, that would scan. Sure, sure.

[00:35:33] Okay. Maybe this is my React bias showing then.

[00:35:37] Mark Erikson: Yeah, I mean, they've, Angular has been introducing signals within the last couple major versions as they're, they are trying to put some emphasis on that, but RxJS is still very integrated into the Angular ecosystem.

[00:35:49] Carl Vitullo: Gotcha. Okay. Looking at survey respondents generally, you know, the number of people who answered like the demographic questions at the beginning versus number of people who answered, who gave any answer for what content do you consume, like 80 to 90 percent do not consume content.

[00:36:05] Like they did not give any answer for what content do you consume, which I just think is really. I think it's an important thing to keep in mind when you're, you know, as people are saying like, Oh, you know, Oh, everyone is, everyone's talking about this. Everyone's thinking about this. So and so made a video on this.

[00:36:19] Like, you know what? Most people didn't see it. Most people are not thinking about that. Most people aren't even aware of that. I just think that, I just think that is a great, Demonstration of like the participation inequality that happens in so many software communities, or that happens in communities generally, where like 90 percent of the people are not participating in the same way as the most active 10%.

Dark Matter Developers

[00:36:43] Mark Erikson: And I have a very specific link for that, which is Scott Hanselman's classic post on dark matter developers, people who are just going to work and doing their thing and going home, and they don't know about the Twitter discussions or what's popular or the trends. They're just doing their thing quietly.

[00:37:01] And we don't hear about them because they're not involved in the discussions. But the

[00:37:06] Carl Vitullo: That is actually specifically the target that I'm kind of going for, for this podcast. I want to be the once a month, one hour long summary of that fire hose. Like, you don't care enough to drink the entire fire hose, stick your face in front of the blast of water, but want to get the signal.

[00:37:23] that's what I view our role here as. We pull that signal out so that you can spend one hour consuming it instead of More than that, If you, instead of it being a part time job, staying on top of the latest news, I want this podcast to be an effective way to do so.

[00:37:37] So yeah. Hello, Dark Matter developers. All right. That is half an hour of content on State of JS, which is good because there was not a ton of, React news otherwise. So yeah, Mark, you want to take us into our lightning round links?

[00:37:49] Mark Erikson: Yep. So having said that we do have a bunch of lightning round stuff to go through.

NYT and Slack update to React 18 (Enzyme to blame)

[00:37:54] Mark Erikson: First off, a couple of interesting company migration blog posts. We were talking earlier about, you know, like only two thirds of respondents being on React 18 and the New York Times put up a pretty big post about how they just updated React. to React 18. Some good details on the work they had to do and some of the challenges they ran into, especially with some of their embedded interactive setups, and some information on some of the performance improvements that they saw.

[00:38:21] One interesting note is that A lot of their work had to do with migrating from enzyme tests to React testing library. And so, on a very similar note, Slack put up a post where they said, you know, we have tons and tons of enzyme tests and we, we tried to migrate those to React testing library. And, it was so hard, we actually ended up trying to automate a lot of the conversion using a combination of AI language models and some various additional tools.

[00:38:52] So, this goes back to the test, and to the whole test discussion. Like, tests provide value, but they're code. And code becomes legacy. And you have to update it and modernize it. And that in itself can be a real drag on trying to change things.

Rise Tools launched

[00:39:05] Mo Khazali: So I'll jump in with a few things. First is that Rise Tools has been launched.

[00:39:11] So Rise Tools is created by Mike Grabowski. So Mike is the former founder of Callstack and he's been very involved in the React Native ecosystem. It's basically, it's not tied to React Native, but it's basically targeting React Native for now. It's a way to build server driven apps. It's a server driven UI app where the server controls how the UI is layouted.

[00:39:32] And it kind of comes with all things battery included, from the server, all the way up to the React primitives, and even some more opinionated UI design systems like Tamagui if you want to use it. It's kind of evolving in a way where it ends up being a bit of a meta framework on top of a meta framework.

Mo's talk about server-driven mobile UI

[00:39:48] Mo Khazali: So a meta meta framework, we're getting into that age of front end development. Um, but it's really cool. It's server driven UI is very difficult. And I talk about how difficult it is in mobile development, many places. And I did a talk recently at a meetup in Poland. So shameless plug. If you're interested to see why this is an actual challenge in the React native world, just take a look at that YouTube video and hopefully you'll get a bit of a primer.

[00:40:11] Mark Erikson: Gasp! A shameless plug on this podcast. What?

NativeWind UI launching

[00:40:15] Mo Khazali: Next up, Native Wind UI is launching. So this goes very much along the same train of thought as we were having a conversation about with the state of React, where a lot of these component libraries are not popular anymore, but people want these sort of copy pastable code components that have 90 percent of the stuff there and they can modify and change it as much as they want.

[00:40:35] It doesn't come with any behavioral APIs. It's just. UI wise, how do things look like and what do the components look like? So this is basically like Tailwind UI. It's going to be a paid UI kit, UI copy and pasteable components and templates. But I think it's interesting that the React Native community is going in this space.

GlueStack too

[00:40:51] Mo Khazali: Similarly, the GlueStack team. So GlueStack is, made by the former creators of NativeBase, which was another popular UI library and. GlueStack is basically the successor to that and they initially had a more batteries included opinionated API component library that is now going seemingly in a very similar direction to native WinDUI and Tailwind UI, which is, we have these copy pastable components.

[00:41:16] So think of it as ShadCN as well, but in the React Native ecosystem. And the lovely thing about both of these libraries is, they work universally with React Native. So if you're targeting React Native on the web, these libraries will automatically work on both web and mobile, which is really cool, and a step in the right direction.

Swift Package manager support, moving away from CocoaPods

[00:41:30] Mo Khazali: More in the React Native ecosystem, so, If you've been in this ecosystem, you'll know that typically what we use on the iOS and MacOS front is we will use CocoaPods as a dependency and package manager. Now, CocoaPods is good, it works, it's one that's been around for a while. The iOS native community is moving towards Swift Package Manager that Apple created themselves.

[00:41:53] And so now this PR got merged, but we will have Swift package manager support for React Native. So if you want to use Swift package manager, you now have the option to do so, which is going to be great for brownfield apps. So apps that are, some parts of it are in React Native, other parts are just purely native.

[00:42:07] This will make it much easier to adopt if you've already been using Swift package manager for your native apps.

[00:42:11] Now, one of the things that has been a challenge with the React Native ecosystem is around out of tree platform support and how easy it is to integrate them with tools like Expo. So out of tree platforms, for everyone who's not aware, are platforms that are not iOS and Android.

[00:42:26] So, web, macOS, Windows, AR, VR, headsets like Vision Pro, and so on and so forth. So those are all platforms that are not officially managed and maintained by Meta, but they have sort of community partners that are maintaining them. And so macOS is maintained by, uh, Microsoft. And one of the challenges there was how do you get Expo to work with it?

[00:42:45] Because previously you would need to do it in a bare React Native app, which means you have to do a lot of the typing and the wiring and all of the infrastructure underneath it. There's this concept of config plugins in Expo, and now there's support for React native Mac OS, and people are seemingly getting ready to be able to develop desktop apps with Expo, which is really exciting.

[00:43:03] Carl Vitullo: Sorry, wait, did you say that this is maintained by Microsoft?

[00:43:06] Mark Erikson: Yes. Microsoft maintains the React native implementations for Windows and for Mac.

[00:43:13] Carl Vitullo: Okay. Just needed to check that. Cool.

[00:43:15] Mo Khazali: Yes. Yeah. this is one of the things with React Native where there's so many people involved now. It's not just Meta, it's Meta, Microsoft, Amazon, Shopify, and name a bunch of other companies.

React Native Filament

[00:43:24] Mo Khazali: Next up, we have React Native Filament. So, it's a hot time in the 3D rendering space of React Native. there's a lot of stuff that's happening in the last few months. React 3 Fibers suddenly got a big boost in the React Native ecosystem. More and more people are talking about it. I've seen a lot of talks in 2024 about it.

[00:43:41] The Skia team, the React Native Skia team have also been talking about GPU and 3d rendering. So they did that at their talk in AppJS. We covered it in the podcast back in May. And so now the team at Margello have released React Native Filament. So it's a base 3d rendering engine built for React Native. The nice thing about it being C is that it works kind of out of the box for most of these native platforms.

[00:44:02] It is seemingly, again, this is how it's marketed, is that it's basically with less than 50 lines of code for you to load a 3d model and basically have things like pan gestures, zooming, and all of that, which is really hard to get.

[00:44:15] And you need to actually manually code a lot of that yourself. So this is really cool. We'll see how it, how it materializes and how it evolves. There's a lot of 3d libraries that are coming to fruition and you've got to choose and see which ecosystem grows. So you're basically placing bets on horses and seeing which one kicks off.

React Native for web devs

[00:44:31] Mo Khazali: On the trend of what we talked with the state of JS and, you know, how, uh, native usage is growing, Kati Kraman from the Expo team, she's written an article, a guide to React Native for web React devs. So people that haven't been in the native space kind of understand what are the things that you need to learn sort of like a TLDR before you can start creating React Native apps.

[00:44:51] This is amazing because frankly, this is one of the things that I always rave about and rant about, if you don't tell people about the gotchas, they'll come and burn themselves in the React Native ecosystem, and then they will hate React Native for the rest of their lives. So, I love education and good education like this, which is specifically targeted for web React devs.

Build Windows apps from a Mac

[00:45:09] Mo Khazali: And last in this React Native train, at least in this one, is that one of the things, again, with out of tree platforms, again, with the Microsoft team, is that they maintain React Native Windows. But you need to have a Windows machine to develop for React Native with Windows, which many of us don't, myself included.

[00:45:25] I have renounced the Windows days since many, many years ago. And so it makes it really hard to build Windows apps. And I've always wanted to do it. I've got an Xbox. You can build Xbox apps with React Native using the Windows implementation, but you need a Windows machine to be able to test your apps, which kind of sucks.

[00:45:40] So they've written an article on how you can build Windows apps, with React Native. On a Mac. The spoiler alert is that it's not straightforward, unfortunately, you have to boot up a parallel Windows machine and then sort of port forward stuff and then use it on a VM to test it out, which is not the best DevEx, but at least there is an escape hatch if you really are inclined to do so.

[00:46:00] So hopefully that opens the doors to React Native Windows for more and more people who are using Macs as their development drivers.

Ecosystem Performance group, e18e

[00:46:06] Mark Erikson: Changing gears entirely, we all know the jokes about how, you know, Node modules is the heaviest object in the known universe. you know, you install one package and you get 1, 500 dependencies installed as a result.

[00:46:20] And there's a lot of factors that go into it. It's how the Node ecosystem has evolved. There's also cases where, you know, certain maintainers are obsessed with Maintaining infinite backwards compatibility instead of allowing the ecosystem to move forward with modern tooling. I've been complaining for years that surely there has to be a way that we collectively as a community could go in and start You know, removing unnecessary dependencies from popular packages and end up improving, you know, download speeds and number of dependencies for everybody.

[00:46:52] And there's now an actual community effort to do this. It's in a group called the Ecosystem Performance Effort. And it's just a community group. They've got a Discord for discussing things and a repo for pointing things out. But it's things like, could we look at, say, the isnumber package? And find the most common parent packages that depend on it, and replace those.

[00:47:16] And end up saving, you know, like, cutting down on dependency trees, and saving download bandwidth for everybody. I'm very, very excited to see a lot of people actually spending time and effort on this. This is the kind of grassroots, you know, like, effort that actually benefits everybody.

[00:47:32] Carl Vitullo: I saw a PR specifically about inlining isNumber, and it did, I don't know if I quite 100 percent buy this math, but the math they did was, by inlining this package instead of installing it as a dependency, we save this many kilobytes. This module is downloaded this many times per week. You multiply those together and ergo, we are saving 440 gigabytes of bandwidth every week. I am, I wonder if that is how that shakes out in practice with like caching and stuff. But if by inlining is number, we can have 440 gigabytes less data flowing through the air. Uh, that's, that's fascinating.

ES2024 released

[00:48:10] Carl Vitullo: We have also, ES2024 has been ratified by the, by TC39. We've got the spec, which is very dense and hard to read. Fun. Rob Palmer, who's part of the team involved in that also announced it on Twitter. A lot of these are like pretty esoteric to me, like well formed Unicode strings.

[00:48:30] I didn't know they were not well formed. Promise. withResolvers, I guess. I don't, I don't know what that is either. ResizableArrayBuffers, ArrayBufferTransfer. Two that are a little bit more salient for me is Array. GroupBy and Object. GroupBy. What a great thing to have added to the standard library. So that's nice.

[00:48:50] There's a regex v flag for creating regular expressions with more advanced features for working with sets of strings. Yeah. Lots of stuff. We've got a new spec, nothing too exciting though.

Memory leaks: Compiler won't save you

[00:49:00] Mark Erikson: We've mentioned one or two different articles that looked at ways you can end up with memory leaks in React applications due to closures and how JavaScript engines actually behave, and there's, there's some discussion of what happens when React Compiler comes into play, and so the author of those posts did some more research and concluded that no, you can, you can still end up with memory leaks, even with React Compiler.

[00:49:25] It sort of ends up in the same situation where. Capturing variables in scope, and due to the way JavaScript engines work, you can still end up with some memory leaks if you're not careful. Similarly, Jake Archibald, who's done a lot of articles and research over the years around JS behavior, also just put up a very, very similar post talking about memory leaks and garbage collection with closures.

[00:49:46] So, this is stuff that I only sort of half understand myself. And so seeing people go into these deep technical dives to research the actual behavior is very helpful. We've also, I believe we've mentioned the new JSR package registry a couple times, created by the Deno team. And there was a video talk from, I believe, Luca, who's part of the Deno team, going into some details on You know, a lot of the stuff that I've run into publishing the Redux packages over the last couple of years.

[00:50:15] You know, issues trying to do the publishing, various problems with npm, goes into some details on how JSR is different, how it's supposed to work, and give some examples of actually doing the publishing. I don't know how much actual usage JSR is getting, but it's nice to see people actually rethinking this.

React Native + Flutter

[00:50:33] Mo Khazali: The next thing is just a little bit of memes. More than anything, someone has decided to post a demo of React Native and Flutter running in a single app, which is quite funny. Believe it or not, I actually have tried this about a year ago. And the reason was we had someone who wanted to migrate away from Flutter.

[00:50:50] So out of these memes, good conversations have actually started around how you can migrate and integrate Flutter and React Native together. In the case where someone wants to move away from Flutter. And you use React Native instead, so pretty fun times.

Bun Q3 roadmap

[00:51:01] Carl Vitullo: Earlier this month, Jared Sumner posted about the Q3 roadmap for BUN.

[00:51:06] He says it's not exhaustive. And in the replies, adds more like, Oh, maybe we'll get to this too. But new stuff they're looking, they, they want to add a full stack bundler. I'm not exactly sure what that means, but I guess it's going to have overlap with like RSPack and probably server components too. I don't know.

[00:51:22] A text lock file. So I guess another lock file format. I don't know why we need another package dependency tool. A CSS parser? on this roadmap seem confusing to me as a JavaScript runtime. He also talks about adding V8 C API compatibility, which sure, that makes sense, I can, I can see that, and getting better snapshots and timers for the bun test and mentions that he would like to ship a Postgres client sometime this quarter, but it's not in the main roadmap post that he made.

Learn Suspense by building a Suspense-enabled library

[00:51:57] Mark Erikson: So, we've been talking about suspense for, what, like six plus years now, but, there's been all the confusion over, how can you use suspense? Suspense only works with, React server components, or can you use it on the client? Are you supposed to use it on the client? There was a really good post that came out recently, Learn suspense by building a suspense enabled library that goes through some of the actual mechanics of trying to build a client side lib that uses suspense.

[00:52:24] I'll be honest, I bookmarked this one because people have been begging for suspense support for RTKQuery. I looked at the issue actually, the issue is at least three years old. So I will probably be referring to this post when we hopefully get around to doing it, maybe later this year?

Mark's talk, "Why Use Redux Today" at React Summit

[00:52:39] Mark Erikson: And the obligatory self plug, so I gave a talk at React Summit last month on why use Redux today, because this is a question that gets asked all the time.

[00:52:50] TLDR, there's a lot of reasons why people adopted Redux in the first place. Some of those reasons no longer make sense, like avoiding the legacy context API, but the architectural reasons to consider using Redux are still valid. Being able to have a centralized store, being able to see that the state changes in the dev tools, having a well documented pattern for keeping state outside the component tree, So, it's not a lot of a sales pitch, it's like half of a history lesson, and then, discussions of trade offs, because I still find myself unable to give an unambiguous sales pitch.

Chrome collects extra data for Google websites

[00:53:24] Carl Vitullo: Cool. This is sort of general tech news a little bit, but Chrome apparently gives Google properties privileged information about your system resources, which is sketchy as heck. Why does Google need to know how much CPU my computer is currently using? Anti competitive behavior. Chrome taking advantage of vertical integration to suck up more data to use for reasons. Not great. Not exciting.

Component, composition, colocation

[00:53:48] Mark Erikson: There was a really good post talking about trade offs and various architectural patterns between different ways to fetch data. Do you fetch data in hooks as components render? Do you do suspense based data fetching that starts nested down in your component tree versus do you try to kick it off, higher in the component tree, say like with a route or a page loader? Some very good actual thoughts of trade offs between these different patterns.

Secret knowledge to self-host Next.js

[00:54:15] Mark Erikson: And then, there was a good article from the folks at Flight Control, where they talked about challenges in trying to self host Next. js anywhere other than Vercel. It's feasible, but you definitely have to do some extra work.

[00:54:29] Hosting Next on Vercel is obviously the happy path, and there's some challenges to try to fill in some of the pieces that Vercel would provide for you.

Node can strip TS types soon?

[00:54:37] Mark Erikson: Last but not, not entirely least, a few bits of news from the Node ecosystem. Node has merged a prototype PR to strip types and allow being able to just run TypeScript files directly.

[00:54:50] Obviously, they're not actually checking the types, but similar to like TS Node, at least stripping off the types so it can just execute the code. Very perfect concept, but they're interested in iterating on it.

Native SQLite drive in Node

[00:55:01] Carl Vitullo: Yeah, there's also, there's now a native SQLite driver in Node. Like if you're, if you have Node, you can now use SQLite. Wild! Apparently this came out of As Node was adding support for more browser stuff, like, apparently, I actually didn't really know this, you can also use local storage, quote unquote, from within Node, and that is backed by SQLite, and so then they did the work, after they got local storage in there, they added on a native SQLite driver.

[00:55:30] I have been interested in Sqlite and the opportunities that it brings for like development patterns for a while, I'm actually making use of it in a bot that we use here in Reactiflux. I have a Kubernetes cluster set up with a Sqlite database just to keep everything co located and local. So I just have to back up a file instead of having to keep a running database server somewhere.

[00:55:52] So yeah, just seeing more motion on Sqlite and seeing it get closer to the, uh, the actual runtime is, Very cool. I think that's awesome.

Node moving away from CorePack?

[00:56:00] Mark Erikson: Then, last item. So, Node ships with the npm package manager. And you've always had to use npm to then install other package managers like yarn and pnpm globally. There's been a long running effort to give Node a way to more directly install and use other package managers automatically.

[00:56:21] If a project actually specifies it, and that's involved Node shipping a tool called CorePack. And it's been considered experimental this whole time, and it now seems as if there's discussions about removing CorePack. from Node. Folks like the Yarn maintainer are not happy about this, and I've seen a bunch of arguing about it, even within the last 24 hours.

[00:56:43] So, who knows where this is going to land. You know, it's not like it prevents you from using Yarn or PMP in either way, it's about ease of usability. But clearly there's a lot of both technical debate and opinionated feelings involved.

[00:56:56] Carl Vitullo: Yeah, I'm surprised to see a move towards getting removed.

[00:56:59] It seems like a very valuable thing to have. It seemed very in line with the general direction of trying to decouple NPM from Node. js. But like you said, it's, this seems to be still very early.

[00:57:12] Mo Khazali: I'm also quite surprised we've started using Corepack, and I think it's actually in the interest of other package manager maintainers, but I'm surprised they have backlash, interested to definitely read more about it.

[00:57:21] Carl Vitullo: All right. That is the last link that we have. Thank you everyone for joining us. We'll be back on the last Wednesday of the month here in the live stage or back in your podcast feed just as soon as we can, which will hopefully be before Monday.

[00:57:33] Mo Khazali: Thank you everyone for having me. Thank you for listening on to my rambling as always.

[00:57:37] Always a pleasure and see you all next month.

[00:57:39] Mark Erikson: Likewise, my two things, I will hopefully be publishing a very, very updated version of the Redux Docs Essentials tutorial within, like, the next few days, I've been working on it all year, and I will be glad to have that done. And as I mentioned at the start, I'm looking for a new position.

[00:57:54] So, if you have suggestions, let me know. Please contact me.

[00:57:57] Carl Vitullo: We gather sources from This Week in React, Bytes. dev, React status, Next. js Weekly, the React. js subreddit, and here in Reactiflux from the Tech Reads and News channel, as well as just following a million people on Twitter and looking for articles that way.

[00:58:11] If you see anything that it seems like we missed, definitely send us a message. An email at hello at reactiflux. com with T M I R in the subject line. That's an acronym for the show. I read every email that comes in, including spam. So I will read it, even if I don't respond to it. We actually got a tip about the RISE tools for React Native.

[00:58:30] Thank you for sending in a tip. That's our first one. Shout out. Thank you. If this is a show that you get value from and want to support, the best way to do so is, like, subscribe. Give it a review, help us show up in discovery charts for other people, or send it to your co workers, even if that gives away the secret of how you know so much about React.

[00:58:46] Thank you so much, see you next month.