Brian Kardell: Okay. Hi, I'm Brian Kardell. I'm a developer advocate at Igalia.
Eric Meyer: And I'm Eric Meyer, also a developer advocate at Igalia. A lot of what we do is code. So, we thought we'd have someone on who can talk about code. Please introduce yourself.
Mat Marquis: I didn't know we were going to talk about code. I'm really more of an amateur beekeeper, but I'm Mat Marquis. I have done some JavaScript in my day among other things and yeah. Yeah, I think I could fake talk about code if you could hum a few bars.
Eric Meyer: I feel like you might be underselling yourself a little bit because you just launched a course about JavaScript, did you not?
Mat Marquis: That's exactly right. That is JavaScript for Everyone with Piccalilli, and it is most of what I know about JavaScript in there. It is quite a bit. I'm sorry, I'm looking at a calendar because it's all been a big blur since launch day. That has been one week so far.
Eric Meyer: Speaking of humming a few bars, it's been one week. Anyway, sorry.
Mat Marquis: Hey, it's been really great being on the show. I'll see you guys later.
Eric Meyer: Now, we're going to cut that part. Where do people go to find it, by the way?
Mat Marquis: Ah, that is Piccalilli, which is next to impossible to spell unless you're from the UK or New England. wil.to/js, that'll get you right there.
Eric Meyer: All right.
Brian Kardell: wil.to is Mat's website.
Mat Marquis: Ah, yes. Yeah. I do have a website. That is worth mentioning, I think, out of date. It does technically have a blog with a whopping two things on it. You know how it is. We all know how it is.
Eric Meyer: Yeah, I do know how it is. Lucky if I blog once a month these days. But for the folks at home who are watching along and maybe have not for whatever bizarre cave-related reason have never heard of you before, what's your background that led you up to launching a course like this?
Mat Marquis: Yeah, a wizard put a curse on me. Again, I live in the Greater Boston Area, so traffic incidents occur and I cut off a wizard. I am cursed to speak about JavaScript, I guess, forever until I am one day freed. No, I don't know. I mean, I fell into this job in 2007-ish and just got a mind for memorizing JavaScript, I suppose. So, here I am with all this knowledge. I should say, I'm not a capital D JavaScript Developer day to day. I'm putting borders on things for a living as the running joke, but I have historically fallen in with some pretty rough crowds, like the folks at Bocoup who are top of the heap JavaScript folks. You absorb a lot of it and you end up memorizing specifications for various reasons. Then one day you wake up in there, you are writing a course about JavaScript.
Eric Meyer: Yeah. So, was this something you came up with or Andy came up with or you were bouncing things off of each other?
Mat Marquis: Yeah, Andy did complete CSS a while back. We both did a course for the Chrome team for web.dev.
Eric Meyer: Oh, I see.
Mat Marquis: Yeah, he did one on CSS. I did two, like an absolute madman. I did one about images and I did one about JavaScript. They're good...
Eric Meyer: Images you say?
Mat Marquis: Yup, images. That's right. Perhaps you've heard of them. Both courses are really dry. It's formatted as lessons and they're still reference materials for web.dev. I didn't want to do that. I mean, in the moment, perfectly fine, but JavaScript's weird and half broken and patently ridiculous a lot of the time. I wanted to write it with that voice. I want it to like, 'Hey, this is wild. You're never going to believe how this thing works,' because that is the reality of working with JavaScript. It doesn't make on paper academic sense a lot of the time. It makes JavaScript sense, which is its own unique thing. So, that was the aim for this course. Andy did complete CSS and running his own show. It worked out great. I think he might've pinged me early on while I was in the throes of a client project, and I was like, 'Yeah, yeah, yeah, yeah, yeah, yeah, yeah. Let's do a course. Sure, sure, sure.' Then time elapsed and then there was definitely a DM one day that was like, 'When do you want to get started?' I was like, 'Right. Yeah.' Then just all in, I mean, 80,000 words later, here we are.
Eric Meyer: Yeah, that definitely sounds like one of those my split attention is writing checks and my body has trouble cashing.
Mat Marquis: 100%. Yeah.
Eric Meyer: Absolutely. Isn't that the story of most of our careers really?
Mat Marquis: Yeah, the whole job for me. Yeah.
Brian Kardell: Well, so this is interesting because I think a lot of us got to know each other on Twitter and things like that, and I knew of Mat long before we ever met in real life or anything.
Mat Marquis: Whatever it was, I apologize.
Brian Kardell: No, no, no, but you're talking about writing checks your body can't cash. One of the things I like about Mat is he's a whole person online. He's not just posting about the tech stuff, which I love. I love the tech stuff, but I also love people who share their weird hobbies or whatever. So, I like following people like Jen Schiffer. I want to see her making candles and writing quirky articles and making silly jokes and doing Twitch streams where her and Potch make fun of Property Brothers and they do property cousins or something like that. So, where all this is going is I know that you were fixing motorcycle, you're into motorcycles for a while. You're posting stuff about some carpentry projects that you did, and I swear I had to go look on your website to make sure that I was not wrong about this, but you got into boxing.
Mat Marquis: Yeah. Oh yeah.
Brian Kardell: So yeah, speaking of the long way around, writing checks your body can't cash, tell me a little bit about how you got into boxing and how did that go?
Mat Marquis: Yeah. I got into boxing at well past retirement age for an amateur boxer. I was 35, 36, which I might as well have a walker with tennis balls on the feet, hobbling into the gym at that point. But it was great. I used to do it when I was really young. I went to a lousy strip mall chain gym and did some boxing. I really liked it, but the environment wasn't great. But then the early 2010s were a heady time in the tech industry, and we were all very, very busy all of the time. You remember that was back during the responsive images saga and trying to build a career in a cave from a box of scraps. I was wicked out of shape. So, we tried, LMM and I, my wife, we wanted a weird workout. I don't want to go and do pushups to have done pushups. It's got to be for something, and if it's going to be for something, it should be, and I cannot stress this enough, stupid. So, we went to circus school briefly. It did not work out for reasons and then I was like, 'Okay, my turn to pick.' So we walked into Boston Boxing in Brighton, and the first exercise machine I see is a big tractor tire on the floor with a sledgehammer, a larger sledgehammer, and a larger sledgehammer with a hunk of metal welded to the side of it. Those were your options for using that workout machine. I was like, 'Dope, I'm in. Let's do this.' Actually, we started taking the fitness classes there, someone else hit you when you do 20 pushups, et cetera, worked my way up to the competition team. I may not be good at much, but I am really good at getting hit in the head. As it turns out, I was so good at it that it overcame my elderly detriment in the sport. Yeah, it was fun. I only ever had one sanctioned amateur fight. It was all smokers, which is just like an exhibition match. It's called a smoker, where the gym just gets a bunch of people from nearby gyms together. Some people come in. They buy a $2 can of beer out of a trash can full of ice, and everybody just hits each other. It was really great. They were really good crew. They did a ton of charity stuff.
Eric Meyer: Which you also have been doing charity stuff recently.
Mat Marquis: I was wondering if you were going to bring it up.
Eric Meyer: You gave me the opening.
Mat Marquis: That's right. This has all been a long con. This whole setup for the podcast has been so I can talk about Megaman.
Eric Meyer: Yeah, exactly. What's Megaman?
Mat Marquis: Story of my career. Oh, oh, you're going to regret this. No, just an old NES series. Mega Man 1 through 6 on the NES, 7 on the SNES. I'm going to stop myself right there. Yeah. Where are we at on cursing in this podcast?
Brian Kardell: We're fine.
Mat Marquis: I played the gosh darn right at Mega Man when I was a kid. I have whatever drives a person to speed run games, whatever gland that is way in the back of my head that I am constantly tamping down because that will consume someone like me, but I do aspire to be a Mega Man 2 speed runner and I can burn that game down in like 40 odd minutes. I don't know what the world record is, if I'm mistaken on what the world record is. I'm definitely way above that. But I have been known to sit for three hours and just play Flash Man's level over and over again to do it as quickly as I can. So, the Megamanathon was a marathon I did on Twitch where I ran through Mega Man 1 through 6 and Mega Man X in a single sitting for charity for Trans Lifeline. I started at $10 per death I would donate, and for every $100 chat donated, I would up my per death rate by $1. So, I ended up at a maximum of $25 per death. All told, I actually have to look it up on my very own website, which you too can do listener if you go to wil.to/megamanathon. I died 36 times, Mega Man 1 through 6 and X, and we raised a grand total of $4,000 for Trans Lifeline.
Brian Kardell: Nice. That's great.
Mat Marquis: Pretty good.
Eric Meyer: Yeah.
Mat Marquis: Pretty good.
Eric Meyer: And 36 deaths across seven games sounds like you might know a thing or two about those games.
Mat Marquis: And it was a shameful display. It was terrible. I shouldn't die in Mega Man 2. I should be able to clear one and two no deaths easy, but the pressure was on. I don't know how to do Twitch. I'm 40 whatever years old. Everything's lighting up and someone's clipping me. There's something about donating bits, and I don't want bits. I've already got bits.
Eric Meyer: But back at the beginning of the discussion about Mega Man and boxing, you mentioned the early 2010s and the heady days of responsive images.
Mat Marquis: Woof.
Eric Meyer: Yeah. You also mentioned you did a thing for web.dev about images. Was that about responsive images?
Mat Marquis: No, the web.dev thing was just here's as much as I can churn out about images, all the formats, all the encodings, all the JPEG. It's decadent and depraved. Yeah, I've done a ton of images work less so lately because the responsive images stuff has certainly settled. But yeah, I was the chair of the RICG, the community group that brought responsive images to the web platform.
Brian Kardell: Do you want to tell the story of that a little bit? Because I was off to the side of that. I don't believe that I actually joined that community group. We had a different community group that I was part of at the time, but I saw a lot of the conversations, I think, that were before that, that were in WHATWG IRC...
Mat Marquis: Yeah. Yeah.
Brian Kardell: I don't know if you would like to tell some brief version of the story because-
Mat Marquis: Yeah, for sure.
Brian Kardell: ... I assume everybody who's listening isn't quite as old as some of us.
Mat Marquis: I'm not sure anybody in the world is as old as me.
Eric Meyer: How many grandkids do you have?
Mat Marquis: Well, you're only as old as you feel, Eric, which is to say there's nobody older than me.
Eric Meyer: Fair enough.
Mat Marquis: Especially this week. Yeah. Well, it's been launch week. It's busy. Before I was the chair of anything, which makes it sound a lot more formal than it was, I was working at Filament Group at the time. This was 2010, 2011, this happened.
Eric Meyer: Yeah, I think around there.
Mat Marquis: And they had just started a project with the Boston Globe, bostonglobe.com, which was to be the big... Ethan Marcotte showed up because he was also a North Cambridge kid like me. He was right around the corner. So, he tagged in with Filament Group to work on the Boston Globe site. It was going to be the big proving ground site for responsive design. Can this be done at scale? So yeah, we're working on the Globe site, and Scott Jehl comes up with a method for just working across viewport sizes as brand new. He determines like, 'Hey, we're serving up images that are large enough to be appropriate for any size viewport.' It means we always have to serve up the largest possible image sources. Works at large sizes, works at small sizes. The opposite is not true. To scale upwards, you get a bunch of artifacting and distortion. This is grossly efficient. If you're looking at it on a small screen, you will only ever access it by way of a small viewport. Why are we serving up a 2,000 pixel wide image for a 320 pixel wide context at the time? So he came up with a pattern where setting a cookie in the head of the document meant that it would be available in time for requests that happen further down on the page. So, that cookie that's set up in the head says, 'This screen is this big. Don't request the larger image, request this smaller one instead' to super oversimplify it. That immediately fell apart because it was based on an assumption about how cookies and requests work.
Brian Kardell: I'm curious, why did it fall apart? It sounds pretty solid.
Mat Marquis: Yeah, it was pre-fetching. It was around a little while after the Globe launched. Browsers were like, 'Hey, just parse out the sources on the page. Go out and fetch them right away and then start doing all the page stuff.' That page stuff included our logic. So, we were banging our heads against, 'How can we find a way to influence these requests if our code can't be executed in time to do so?' And I don't know who it was, but someone was like, 'I don't think this is doable. I think we need markup for this. We need something baked into the browsers to handle this for us,' because it's a browser level concern. They're deciding when to make these requests. We have to offload that to them. So, a bunch of us got together in an Etherpad, I don't know if everyone remembers Etherpads, and just started spit balling some markup. I think it was Bruce Lawson who pitched a picture element to do some of this selective loading the same way video and audio did or do. We were like, 'Yeah, done, check. Now we just go and tell web standards that we want this and they make it for us.' What ensued was several years of mailing list arguments and IRC channels and getting very, very shot down and compromising over and over again and me just continually picking the same fight. Then eventually, the W3C rolled out the community groups program, which is very much aimed at like, 'Hey, workaday developers and designers, get involved in web standards.' So we did. We super did. we immediately took it to a pirate radio place where we were publishing drafts of a spec that did not count for anything to anyone and just sending it around like do this, do this one, do this one. Eventually, they did do that one. We ended up with source set, sizes. We ended up with the picture element for what's called the art direction use case, where you need to say, 'Explicitly serve this based on these dimensions versus source set,' which is just like hey, get the most efficient thing from this list of potential sources. That was the RICG's journey.
Brian Kardell: There were a lot of members of RICG that went on to be very involved in web standards and a bunch of other things too. I don't know how many of them were working for vendors at the time, but definitely-
Mat Marquis: Very, very few. Yeah.
Brian Kardell: Definitely Yoav, actually, Yoav Weiss got into writing browser code because of this, right? Well, not necessarily in that order, but it was like he was crowdfunded to-
Mat Marquis: Right? I think it might've been in that order because I think we did the Indiegogo for... We got it 'standardized' enough that it was time for some example implementations and browsers, but us just complaining in bug trackers wasn't enough for WebKit or Google to haul off and do it just to see if this idea had any merit. So, we did an Indiegogo to raise money to hire Yoav to implement it in Chromium, and we raised 10 grand. We paid for a lot of his time and it worked. Eventually, he proved it there and it caught on from there.
Eric Meyer: I mean, that's the kind of story that Brian and I love because it's literally about grassroots developers needed a thing and somebody or maybe more than one somebody-
Mat Marquis: Many somebody.
Eric Meyer: ... went through the process of shoving the rock up the hill as much as possible and sometimes having it rolled back down a bit like you said and then you keep shoving it up the hill, figuring out what can be done, and then eventually getting to the point of, 'All right, let's collect some money and hire somebody to do a thing.' They did the thing. Now that's part of everybody's experience, which is pretty fantastic. There are not enough such stories, but we love that this story is one example that does exist.
Brian Kardell: The W3C has this notion of community groups. You can create a community group and try to get a community together to help flesh something out and try to get some interest and things, but Eric and I also sit on the Interop Committee. I mean, I can tell you from working here at Igalia, like there's infinity asks of the web platform. So, I mean, I was certainly in a very different place in 2010 where I was like, 'Just do the dang picture, just do it' It's like okay, but there are also 800, 8,000 other things. People are always like, 'Just do it. Just do it. Just do MathML, just do SVG, just do browses, just do HTML import, just do shadow DOM.' It's hard to prioritize those things. I really like that the Responsive Images Community Group were like, 'Hey, look, we can't get it prioritized, and so we're going to organize and get it prioritized.' I feel like that was very effective and it is a shame that we don't do more of it in my opinion. Another thing that was in that same domain that you were interested in and helped to try to keep instigating was container queries, right?
Mat Marquis: Yeah. In our exhaustion, at the end of the responsive images saga, we were like... You picture the end of the movie where the protagonists, they're bleeding and they're all bandaged up and they're like, 'All right, who's next?' We were like, 'All right, so we're going to real quick do container queries.' As it turns out, no, I didn't have it in me to keep pushing the rock up the hill. I'd already pushed one rock and buffed it nice and smooth and round, but if nothing else, we at least started making noise about it, which is to be clear though, RICG was full of very, very, very smart people by the hundreds. Also, I was present, making a lot of noise and picking fights in IRC. We did manage to make a lot of initial noise around container queries where it's like, 'Hey, we need something for this. Please, we need something for this.' Just like with responsive images, the pushback was immediate and iron clad. No, cannot be done, impossible to do. The web as a platform cannot support this. So, you send emails and you pick fights in IRC and you send more emails. At least, it knocked it a little loose. We loosen the jar for everyone else to follow, and really, what more can one ask? They're here, they've arrived.
Eric Meyer: Right? And it's interesting to me how many things just in the last few years have started landing in browsers that for years or decades, literally, we were told-
Mat Marquis: Oh, it's so fast.
Eric Meyer: ... iron clad cannot happen. The web platform absolutely cannot support this. Browsers cannot do this, has container queries.
Mat Marquis: We might fix headings. Headings might be fixed. Do you believe in miracles?
Brian Kardell: Literally, the oldest problem for the web. I know I say this a lot, but the very first email that Tim Berners-Lee sent on WWW talk was like, 'This heading shit is not going anywhere. We got to fix it.'
Eric Meyer: Hey, gang, I don't know about this one.
Brian Kardell: It's too late. Come on, guys.
Mat Marquis: Yeah. Well, once part of the platform, always part of the platform, which is-
Eric Meyer: Yeah, who was dumb enough to add all these numbers to these each elements?
Mat Marquis: What a mistake. Yeah. I mean, not to bring it back full circle to the JavaScript course, but that is 100% the stuff I'm touching on in there too, where it's like, 'Hey, once this stuff hits the platform, it's there.' Once it's out on the web, you get document all for the rest of your natural life and it's always going to be the only falsey JavaScript will ever acknowledge because of 10 days in 1995.
Eric Meyer: Talk a little bit more about that. What's in the course? Who's the course for?
Brian Kardell: Yeah. I also want to ask you a really specific question about the course, which is that example that you just used is perfect one because is it JavaScript including all the DOM APIs?
Mat Marquis: No, we touch on them a little bit, but it is pretty focused JavaScript the language as it is played. So, for context, Andy Bell let me write what I called weirding modules, which is definitely a reference to the Dune movie directed by David Lynch, which is a good movie to me, which are these little disclosure things buried in the lesson where the lesson is on Boolean, it's true and false. How hard could it be? Three thousand words later. In that is a little disclosure element where I write, 'Here are what the falsey values are in JavaScript. It's the empty string, it's zero.' And then there's a disclosure module that's like, 'Okay, fine. There's one other thing.' Then I write about the storied history of document all where it's like, you could skip this. You don't need to know about document all to write modern JavaScript. That's what the course is focused on. Get to work, go from junior to senior developer is the tagline. But for you sickos out there who really want to know why non is not equal to none, here's a little side quest for you to check out. So, yeah, there's a whole tirade. I go on a tear about document all.
Eric Meyer: I'm absolutely one of those sickos.
Mat Marquis: Oh, 100%. I don't know if all the course branding is retro, future, janky, on purpose washed out. I'm going to kick myself for saying this after. I like JavaScript because it sucks. It's a boom mic in the shot. It's got charm. You can see where people made it. There are gaps. There's grid on the lens. Document all is in there forever, and this is the future we imagined in the '90s. We sat down and we were like, 'What's the web going to be like in 2025?' Let's figure it all out over a week and a half and just give it our best shot. All of that is still locked in there. It's so weird and so clunky, and you get so much creativity through constraints with JavaScript, if that makes sense. I think we do ourselves a huge disservice by trying to paper over it with layers and layers and layers of frameworks to get rid of what it is, to distance arm's length the whole thing. So, we don't have to think about how it actually works as much. Yeah, I mean, it is the platform. It grew up alongside the web and it is janky and it is open by design and it works most of the time. It's a little weird, and that has been my tagline unofficially at the start, but officially by the end is that we're going to get weird. No one starts out as a capital D JavaScript Developer. Nobody has JavaScript brain. That's not real. All the people I've ever talked to who are like, 'I can't do JavaScript.' That's a programming language. This, I want to be like, 'Are you kidding me? It can't do math. This thing's a mess. It's a clown shoes.' Of course, you can learn it. We can all learn it. Yeah, absolutely. Look at all this stuff you can build with this big old honking pair of clown shoes. It's great. So you heard it here first, folks. JavaScript, big old honking clown shoes.
Eric Meyer: And like you say, it's got charm.
Mat Marquis: It's got charm.
Brian Kardell: I had to look up because I'm bad at remembering the name of the laws. So, the law I'm thinking about is Hyrum's Law, which is with sufficient number of users in an API, it does not matter what you promise in the contract. All observable behaviors of your system will be depended on by somebody. That's an interesting bit about the web is that even things that we didn't standardize, we didn't intend to write down, still end up stuck in there. So, even really weird things that people just discovered. I mean, I know most people don't think about the iteration order of property keys and things like that, but there was diligently reverse engineered copying of that until it became necessary. Do you have a lot of other examples like that that are in the book? I find those things just really fun.
Mat Marquis: Oh, I was just going to say, for all the time I have spent cursing the array constructor, and it's like, 'Why have they done this to me personally? Why have they visited this slide upon me professionally?' Yeah. The alternative is if stuff gets fixed, we burn the library of GeoCities, everybody that relied on this janky old thing before anybody knew any better way back when. I don't mind eating the cost of remembering that something's a little weird for the sake of long-term longevity of websites I have never seen and will never see that the authors completely forgot about that are just kicking around on some Zanga someplace. That's great. I love that stuff, man. What a part to be able to play in that, just remembering that array is weird.
Eric Meyer: Yeah. I'm going to throw in an XKCD 1172. Every change breaks someone's workflow.
Mat Marquis: Oh yeah. Hometown hero, Randall Munroe in a way. Yeah, the famous XKCD, which you are now going to have to put in show notes, I apologize, where the dream coordinates appear.
Eric Meyer: Okay.
Mat Marquis: Yeah. It's a park where I used to play at as a kid, North Cambridge.
Brian Kardell: Oh, cool.
Mat Marquis: He lived for a long time right in my old stomping grounds where I grew up. A bunch of people went there on the designated date to the designated coordinates, and I guess it got real weird. I was not present.
Brian Kardell: So I feel like I got to follow you before you went to Bocoup. I know there were a couple of events that we wound up together, and I really liked listening to you speak. I think you were speaking about performance at the time.
Mat Marquis: Yeah. I had a talk on responsive images, and then I had a couple of talks year over year about just general front-end performance stuff, one of which was at An Event Apart, which was big career goal to speak at Event Apart in Boston. Eric, you remember and you were there.
Eric Meyer: I was there?
Brian Kardell: Did you come to Pittsburgh for abstractions one year?
Mat Marquis: Yes.
Brian Kardell: I think you were hearing in my stomping ground for that.
Mat Marquis: Yeah. Liza Gardner was supposed to speak and had to bow out last minute. It wasn't you, was it? Somebody was like, 'Hey, do you want to give a talk?'
Brian Kardell: Yeah, I believe it wasn't actually. Yeah.
Mat Marquis: Yeah. I was like, 'Do what now? Yeah, sure.' I mean, again, what a time for the industry where I was just like, 'Sure, I got to talk. Ready to go? Let's do this.' Yeah, that was good. That was a good show.
Brian Kardell: Yeah, no, it was really good actually. Yeah, I really enjoyed it. Where did you learn your JavaScript? How did you pick it up? I mean, for me, I got the JavaScript Bible, the Rhino Book, and I watched a lot of things over the years. I mean, I read what I could of the ECMA spec. I was involved in a lot of the ECMA mailing lists and things like that. But I remember seeing a lot of really good talks over the years by Doug Crockford or Brendan gave some good talks. Yeah. How did you learn about-
Mat Marquis: Oh, just boy. Just working in the semicolon mines, just faking it until I made it. I mean, I started with career sponsored by Stack Overflow where I was just grabbing snippets of jQuery and dropping them in and wondering whether they would or would not work when I reloaded the page. Yeah. I was very faking it when I got started in the industry. I lied my way into my first internship by saying I was picking up projects on Craigslist just because I was like, 'I guess I can make a website having done it a couple of times. Maybe there's a job here.' One of them was to install phpBB for someone. So, I did it, and they emailed me. The client emailed me after and was like, 'Hey, is there any chance... We're looking to hire a first intern? Are you a college student, and are you looking for an internship?' I was like, 'Oh yeah, big time, 100%. Please give me a job with a chair.' I was not a college student. I have never been to college. I did not need an internship, but by the time I revealed it to them, I had already been there long enough that I'd figured out how to do the job and it just played out from there. It was just keep on trucking, get to the point where I could read through eloquent JavaScript and get 15% of it and then revisit it in a year and get 20% of it.
Brian Kardell: So a lot of the quirks and the weirdness, is there sharp edges that you cut yourself against?
Mat Marquis: Oh, yeah. At the time, I didn't know. I was just like, 'Yeah, I mean, I pasted it in there and it seems like it works.' A good way to sum it up is that that's a little bit what I want to give back to newer devs now with the course, not sharp edges specifically, but if you're just slinging React all day, you don't see a lot of the grit in there and that is fundamentally how it all works. As much as we joke about it being janky and broken, that is the language. That is how it functions. So, yeah, a little, let's say, controlled exposure to some of that deep down jank and how the gears mesh, I think, is important. I think it's important for learning the language to know what's going on in there, but that is absolutely, no question in my mind, I use document all at some point. I can't recall when or where specifically, but if it was somewhere on the internet where I could copy and paste it, I probably used it.
Brian Kardell: Yeah. Well, I mean, at the time, it was really, really useful. But there's all kinds of other things that are very easy to cut yourself on when you don't know that are hidden landmines, I guess.
Mat Marquis: Any arithmetic for floating point.
Brian Kardell: Exactly.
Mat Marquis: And I'm not confident enough in my own ability to do math. When I would do stuff and it would come back with the number wrong, I'd be like, 'What have I done? How in the world did I do this?'
Brian Kardell: I think also, any ID that you've declared becomes a global variable. You don't even have to say document only by ID. It will just be there. That's incredibly strange.
Mat Marquis: Or is it a key for document all? It's one of my favorites. I almost didn't write about it. Then Mike Pennisi, who I worked with at Bocoup, was my tech editor on this, best in the game, hands down, best JavaScripter I know, left a comment on something unrelated that was like, 'You have to do document all.' I was like, 'Do I want to get into all of that for these poor unsuspecting... Do I want to mold young minds in that way?' Yeah. Yeah, of course, I do. Yeah, it's wild in there. Welcome to JavaScript.
Brian Kardell: Yeah, I mean, I love that we have things that are teaching this because one of the things that I think makes people give up is when they find something that they're like, 'I have no idea what just happened.' That's really frustrating, so I really appreciate courses that point to the thing that you might accidentally stab yourself with and say, 'Maybe don't stab yourself with that. Beware, there's a sharp pointy bit there. Don't stab yourself.'
Mat Marquis: Yeah. I've never been a big Dark Souls guy, but I feel like that's effectively what the courses for JavaScript is me leaving messages that are big boss ahead, watch out.
Eric Meyer: It's dangerous to go alone. Take this.
Mat Marquis: Exactly right. I'm currently obsessed with Hollow Knight: Silksong. So, it's dangerous to go anywhere and do anything in that game. God, what a good game. Sorry, no video games. Sorry.
Eric Meyer: Yeah, we're well past that point now.
Mat Marquis: Yeah. Yeah. Story of my life.
Eric Meyer: So you said documents.all. Did you touch on document.write?
Mat Marquis: I did not.
Eric Meyer: Okay. Well, that's good.
Mat Marquis: Yeah. Well, and see, this is one of those things where I'm like, 'I don't want to give anybody ideas. I don't want to do a don't stick peas up your nose,' if you're familiar with that adage, where a parent says to a child, 'Whatever you do, don't stick peas up your nose.' The kid says, 'I never thought of that.' But God, where do you draw the line? I mean, we were originally planning for 60,000 words, and I ended up at 80,000.
Eric Meyer: That's not so bad.
Mat Marquis: Yeah, and I'm still kicking myself. There's so much I didn't get to, and I ended up in the week before launch writing a whole module about the entirety of asynchronous JavaScript.
Brian Kardell: Oh, that's interesting. Yeah.
Mat Marquis: Yeah. I can't let this go out and just be like, 'So JavaScript is a language constrained by linear time.' So I did a whole bit where I introduced myself at the start of that module. At the end of the course, this is spoilers for the course, I concluded the previous module with, 'Now the course is over. Thanks so much for your time.' Started the one on asynchronous JavaScript by introducing myself and then interrupting myself mid introduction like, 'Wait, how did I get here? I'm not supposed to here unless he set it up so that this module, because I'm writing this first, he probably put this at the end as a meta bit.' You got to make your own fun.
Brian Kardell: Yeah, I agree.
Eric Meyer: Absolutely, 100%. Most of my demos are me telling jokes to myself.
Mat Marquis: Exactly.
Eric Meyer: Literally nobody else will get. So, at least your jokes, other people will get. So, well done.
Mat Marquis: Well, I don't know. I insisted that Andy build air horn button at the end of the course, spoilers, but there's a button you can press to just blast people with an air horn. I warned people I was going to do it a bunch of times. I left block quotes open for Mike Pennisi to make fun of me for the tech editing process. I was like, 'A lot of people will confuse arguments and parameters, just the terminology. One is used here, one is used there. I am going to mess this up a bunch of times. Here is an empty space for Mike to make fun of me for doing exactly that.' You got to play with the medium. What are we doing? It's the web.
Eric Meyer: You got to make your own fun, like you said.
Mat Marquis: Got to make your own fun.
Brian Kardell: I mean, I personally get more from a course or instructor or a writer who engages me somehow to keep me interested. So, I feel like that's really good actually.
Mat Marquis: That was the goal, and there's a time and a place for the web.dev super dry reference materials. Here's what you need to know about what an iterator is full stop.
Eric Meyer: But then there are other places.
Mat Marquis: Then there's this course.
Eric Meyer: Yeah, a different thing altogether. Speaking of carpentry, over the weekend, I unboxed my new combination belt and disk sander from WEN and the packing and unpacking list at the beginning of the instructions says, 'Unpacking with the help of a friend or trustworthy foe, such as one of your in-laws.'
Mat Marquis: Wow.
Eric Meyer: They're making their own fun. Somebody check in with the instruction writer, see if everything's okay at home.
Mat Marquis: Yeah. Someone showed up at work Monday morning. They had a surprise email. They've got a slight hangover, and they're like, 'Yeah, you know what? Fine. Let's have fun with it.' Yup. I get it.
Eric Meyer: Yeah. Having that voice, always useful.
Mat Marquis: Yeah.
Eric Meyer: People notice.
Mat Marquis: Which I mean for a topic like JavaScript, I think there's a time and a place for a little of that because it is fundamentally ridiculous in a lot of ways and for sure you want the dry... The MDN is doing a better job than I could ever hope to do, explaining all the parts of JavaScript, all the component parts, but you get to the end of some of that and you're like, 'What?' And that goes unanswered. So, my goal for voice and tone was to be like, 'All right, listen, I know. Here's our best guess at why it is like this though.' At least at the end, it's like, 'Okay, I guess it's just like that,' which yes, it is spoilers for the course. It is just like that.
Eric Meyer: Yeah. So, a few times now, you've said the JavaScript is fundamentally ridiculous, which no argument for me.
Mat Marquis: Yeah. I mean, samesies to be real.
Eric Meyer: So maybe that's why it calls to you.
Mat Marquis: That could be it. Yeah. Neither of us make any sense. Neither of us can do math.
Eric Meyer: Other than the obvious things like not being able to do math, what's a good example of fundamental ridiculousness?
Mat Marquis: It's just the stuff with the fingerprints on it that the array constructor works as a constructor if you don't invoke it with new, and it's like, 'Sure, sure. Yeah, yeah, yeah.' It can't ever be changed, and it's because a person made that decision at some point somewhere. If you're brand new to it, someone says it's a programming language and you're just thinking it's this cold, clinical, the border here situation. It's what's so imposing. Once you're intermediate at JavaScript, you at least get the gist of it and you've learned the rules of it. There are so many places where the rules do not apply, and it's like, 'I just got here. What are we doing?' I guess that's the specific ridiculousness inflection point for JavaScript is once you've learned the rules, once you've got a handle on how it works, then you start learning all the ways that it does not work the way it works. That to me is the ridiculousness of it.
Eric Meyer: I like the fingerprints thing. CSS has a lot of that as well, where a lot of times the answer to the question, 'Why is it like this?' is because at a working group meeting, there was a morning in late 2000 where the working group was just like, 'Well, this is how we think it's going to go.'
Brian Kardell: Well, there's also that in any of these, whether it's CSS working group or TC39 or whatever, where's the bunch of individuals who are often speculating what developers will find intuitive.
Eric Meyer: Yeah, we're just meat that electrocutes itself to move around, man. What are we doing, making decisions about how programming languages work?
Brian Kardell: But I mean, surprisingly, there isn't one answer to that question, right? If you have a question that you think, 'I definitely know what everybody thinks about this,' and they run a poll on it, you'll find that you're wrong.
Mat Marquis: And for all you know, the poll is also wrong. It is some secret third thing. Yeah, we've been building the plane in the air since 1993 or whatever.
Eric Meyer: Yeah. So, the flip side of the fundamental ridiculousness, you said you actually would regret saying that you liked JavaScript.
Mat Marquis: I do.
Eric Meyer: What's something specific that you like about it or that you found that you liked in the course of writing this course?
Mat Marquis: Oh boy. Oh boy. That's tough because I am the sicko that the weirding modules are for. So, I've given up the game there by saying I like the weird things. Yeah, I don't know. Because again, and this is not a confession, I've mostly put borders on stuff for a living. I write a lot of click the button, something happens in JavaScript, which is not a knock. That is absolutely what I do for a living. So, I don't get a lot of time to tinker with iterators, and that was something I had to write and rewrite a couple of times because I was like, 'I'm missing something. There's something about this I'm missing.' Even for me, by the end of it, I was like, 'Got it. Locked it in. This is satisfying. This is strange.' It calls for shifts in thinking that the human brain doesn't necessarily jump right to, but once you got, it's locked in. You understand this, and this is not just how iterators work. This is how iterables work, this is how all iterables work. This is how every array and every array works, and there is something very satisfying about that. This is going to sound wild. In a Sonic the Hedgehog design documents way, yes, so when they were making Sonic the Hedgehog, from my understanding, the main thing they wanted to capture and the reason the movement in the game is the way it is, where you're actually pretty slow and it takes a long time to build up momentum and the jump is super floaty, is because they wanted to optimize the game design for that feeling of going fast. Those relatively rare segments in Sonic the Hedgehog where you're just tearing across the screen, no control over anything that's happening, and then it stops you again, and it makes you slow down and do a bunch of deliberate platforming, boy, what a wild metaphor. Learning about iterators is a lot like the slow parts of the platforming in Sonic the Hedgehog, where once you get through that, once you get to the end, the way is clear. It's like, 'Oh, I don't just get this. I get a bunch of other stuff that I didn't even know I didn't get.' That is so satisfying. Like so many hedgehogs, I got to go fast. To me, that is the peak of JavaScript mountain is when something locks into place and it's like, 'I get a bunch of stuff. I can tear through this now.'
Brian Kardell: I am constantly thinking about this. How are we doing and how do we measure how we're doing? When I hear you say, it's weird, we have a lot of people working on TC39, and they do get into esoteric arguments and debates and things like that.
Mat Marquis: Oh, sure.
Brian Kardell: Sometimes I wonder, are the results coming out of it good? Are they better? Are they worse? And the answer is like, yes, they are better and they're worse.
Mat Marquis: Right. Yeah. The number of weird tangents definitely is reduced as the course goes on, starting from here's what a primitive is to here's how to extend classes, things get a lot more uniform and let's say sensible, but still static initialization blocks. All right, even here in the future, I can see how people got there. It makes a sense certainly. I don't disagree with it. So, even the modern additions to the language, it's still a little nyeee, but as the course goes on, as we get into classes, it's like, okay, welcome to perma strict mode. What a time to be alive. Everything you've learned so far about how it's good in strict mode and different not in strict mode, you can rest a little assured. There's a progress toward making more and more conventional definition sense. But yeah, you can still see the fingerprints. It is still decisions made by people, and famously people make some decisions.
Eric Meyer: They sure do.
Mat Marquis: Sure do.
Eric Meyer: Well, I would love to just keep this going forever, but we all got places to go, things to do, people to run over, so especially you live in Boston.
Mat Marquis: I have a car, but I pedestrianize whenever I can. There's just no sense in it here.
Eric Meyer: I think we've mentioned, but let's wrap up by saying where can people find you?
Mat Marquis: Yeah, I'm wil.to every place. Like blue sky, I'm wil.to. My website is wil.to, which is probably the best focal point for seeing what I'm up to. The course, JavaScript for Everyone, is at wil.to/js, or if you want to challenge yourself to spell the word Piccalilli right on the first try, piccalilli/javascript-for-everyone with hyphens in it. Yeah. You know what? It's wil.to/js.
Eric Meyer: Yeah, let's hear it for homebrewed URL shorteners.
Mat Marquis: Oh, yeah. I think it's just a redirect I have set up somewhere. It's not like I know how to make a website. I mean, can anyone?
Eric Meyer: Yeah, honestly, who does?
Mat Marquis: Right. Exactly.
Eric Meyer: Anyway, Mat, thank you so much for joining us. Really appreciate it.
Brian Kardell
Eric Meyer
Mat Marquis