Keynote: Lateral Thinking with Weathered Technology: How The Nintendo Philosophy Applies...

Shit like

Speaker 1: Okay, um well thank you for having me. Um I'm uh this is a very big city compared to what I'm used to. I'm from a very small town in Montana called Bozeman. It's getting bigger, but nothing like Nothing like Chicago. And what I want to talk to you today is about a philosophy from a game company called Lateral Thinking with Withered Technology. And I want to think about how to adopt that philosophy for our software development, how we can do that. And so I'm going to be talking again about a toy company philosophy. And relating that to software might be a little bit of a stretch, but it's such a cool idea that I felt like I had to at least try to do it.

Speaker 1: This is uh Gunpei Yokoi. I'm gonna butcher that, I'm sorry, but uh that's as close as I can get. And uh he was an employee at Nintendo, which most of you probably heard of Nintendo. Um And uh he was the first electrical engineer at Nintendo. So Nintendo is actually a fairly old company and uh had uh produced regular toys, card games and things like that for a long time. He was hired on and uh he was uh responsible for Nintendo's first digital product, which was uh called the Game <unk> Watch. He also helped design Donkey Kong and Mario Brothers, two games you may have heard of. So he's a very important person at Nintendo. His most famous success, the one that's nearest and dearest to my heart,

Speaker 1: was the Nintendo Game Boy. And it was released in 1989. and uh sold over a million units in the first year. And so that was a huge, huge success um uh at the time. Um and uh One thing that's important or that we don't necessarily think about now because everyone knows the Game Boy. Game Boy was near and dear to my heart because in 1989 I was 13 years old and it was the only thing in the entire world that I wanted. But at the same time the Game Boy was released, there were other systems that were released as well, and in particular the Sega Game Gear. was released at the same time. And just to uh show you a comparison between what these two technologies did.

Speaker 1: So here on the left we have the Game Gear and here on the right we have the Game Boy. So the Game Boy kind of became famous for having a it was a two-bit Well not not in the insulting sense, but it was a two-bit screen. It had two bits, so there were four total colors for any given pixel on the screen. It was pretty small. And that was in contrast to the Game Gear, which had a full color screen, much more sophisticated, much more uh advanced. And this was a point where color TV was, you know. The black and white TBO isn't really a thing anymore. Um so Sega took tried to take advantage of this and uh put out some if you think that insulting people on the internet is new or insulting people in general is new, it's not. So this is a an ad by Sega

Speaker 1: basically dogging on uh Nintendo for putting out such an underpowered uh uh system compared to what uh they were putting out Um and uh so Nintendo, I mean Nintendo is not a company filled with dummies. They know what they're doing. Why did they put out uh a A system with such an underpowered screen relative to the competition? And the answer is Gumpei Yokoe's philosophy of lateral thinking with withered technology. And so lateral thinking, it's two components, lateral thinking and withered technology. So lateral thinking is taking an existing technology and adopting it to a new use or context. And uh this was something that he recognized when he was on a train actually in Japan and he saw a Japanese businessman playing with an LCD calculator.

Speaker 1: Those were relatively new, the idea of a pocket calculator was a new thing And uh he saw someone just messing around with it because he was bored and was just trying to do something besides read a book. Um and he realized, hey, you know what, we can make games with these uh calculator screens. And so the first game and watch uh games that were produced by Nintendo were sort of sing these single game handhelds that were very simple, didn't do very much, but um but they were very, very successful. And so that was an example of him taking a technology, LCD screens, and thinking laterally with it. Withered technology The translation might be a little bit bad. Maybe seasoned technology is another translation that I've seen, and I like that a little bit better. Withered has a pretty uh bad connotation in English.

Speaker 1: But seasoned technologies are technologies that have existed for a while. So at the time they were trying to produce the game the initial Game <unk> Watch systems LCDs were around, they were cheap because they were the technology was well understood, was relatively uh inexpensive and pretty stable, pretty stable at the time. And so that was an advantage of these seasoned technologies Now the Game Boy me we uh you know at this point everyone knows how hugely successful the Game Boy was, but when it was released at the time, the influencers of the time, who were uh the the uh game magazines that what didn't have the online uh presence that we have now Um they uh they weren't very impressed with it. They gave it a bunch of sevens. One uh one guy even gave it a two

Speaker 1: and uh Sony obviously tried to take advantage of the fact that Nintendo was not using the latest and greatest technologies in their handheld. But despite that fact, the Game Boy was a tremendous success. Obviously, it was the most successful handheld of that era. Far outpaced the Game Gear Atari had the links, which was really nice. The NEC I always liked the NEC Turbo systems, but the Turbo Express was available. None of them came close to touching what uh the Game Boy did as far as uh selling. And why was that? Why did the Game Boy win? Well it it it won because of the realization, Nintendo's realization, that technology is not its own end. Technology is not its own end. It's in service of something else.

Speaker 1: And the end of the Game Boy was fun. Could it be fun? And did you have to use the latest technology to achieve that? Well, technology is obviously important. I'm not going to say it's not important , but it's not primary. But the primary goal of the Game Boy was for people to have fun. And by choosing an older technology, the Game Boy was able to keep costs lower, so it cost less than all those other systems. It had way better battery life. It ran on just standard AAA batteries. And it was also far more rugged than the competitors. So the seasoned technologies that the Game Boy used allowed it to be a more sturdy, a sturdy system for people to work with. And uh Nintendo adopted this, uh kept rolling and

Speaker 1: has continued rolling with this philosophy. Um so the Wii, if everyone remembers the Wii, um was uh basically the same hardware as the GameCube It was almost identical, not significantly different. And uh what Nintendo recognized there is okay, Sony and Microsoft have come into the gaming home gaming system We're not going to be able to compete with them on spec, or if we do, we're just going to be the same as them. So instead, let's focus on other things. Let's focus on shrinking the existing hardware. Let's focus on using uh technologies like infrared that no one else is really looking at to make to build a new experience. experience to do something new and interesting. And let's focus on fun. Let's not focus on technology. Let's not try to beat Sony in the specs

Speaker 1: game And they've been very successful. Because of that, the Wii was, again, much more successful than other quote unquote technologically superior systems. So this was another win for the seasoned technology approach to things So, how can we apply this concept from Nintendo that I fell in love with as soon as I saw it? How can we apply this to web development? Well, web development like consoles can often be dominated by the new new thing. What's the newest, coolest thing that's out there? Um and I think that's often for the same reason. There's a news cycle It's gotten maybe even more compressed lately where like, okay, something comes out and then people are immediately looking past it at what the next thing is. And our industry tends to prioritize

Speaker 1: prioritize new things over seasoned well-known things, at least an online discussion. I don't know if that's the fact on the ground, the number of lines of code that are being written, but that's how it at least appears if you believe online discourse. Now people at a Django conference are not necessarily as prone to this habit as other people, and that's a good thing in my opinion. So that's one reason why I'm uh excited to be talking here. But even if you are not as prone as the rest of the industry to following the new new thing, I'm sure everyone in this room has at least felt the pressure to adopt the new new thing. If you don't adopt X, you're going to be left behind. Like that pressure that exists in this industry. And that's a pressure that I think can lead that can lead us

Speaker 1: to and has led the industry to abandon some really good ideas or at least leave behind some really good ideas And one of those really good ideas that I would say is a foundational, if not the foundational, idea of the web is hypermedia. So I'm obviously very passionate about hypermedia. I've uh uh created the hypermedia research group at Montana State, but it is a pretty seasoned technology. Now, I know in this room the majority of Djangonauts know what hypermedia is, but there are some young web developers who have never heard, like just they've never heard it discussed. And so I'm going to do a really brief overview of like what hypermedia is. So hypermedia is basically, I think the the quickest way to get there is that it's a media

Speaker 1: that has something in it, a really special uh set of things in it called hypermedia controls. And uh hypermedia controls are things like the hyperlink. That's probably the most famous hypermedia control. But this is an example of a hypermedia control. And what's special about hypermedia controls is that they embed both uh display information and also control information in one thing. in one thing. And so the canonical example of that is the hyperlink. And so a hypermedia such as HTML is just filled with these little things that when you interact with them, they do something. They make some request to a remote system and then uh something happens. They you load the content from that remote uh URL into your browser.

Speaker 1: Um and um The other major uh hyper user interactive hypermedia control, anyways, I'm sorry if I'm using a little bit nerdy language, but um is uh is the form. And so links and forms. Think back to the start of the web, links and forms was how we built things. And forms, again, I've met young web developers who have never used a form to submit data to a server to update a resource. It's a little shocking, but that's the way it is these days. But a form is uh these links and forms are the two major hypermedia controls that you're gonna find in HTML. And uh these are definitely seasoned technologies So they've been around, uh both have been around since 1999, that's when HTML2 came out, and that added the form, and that's what transformed the web from a read-only hypermedia system, which is the

Speaker 1: what the majority of hypermedia systems were in the past. into a read-write hypermedia system and uh really unlocked a tremendous amount of value uh at that point. Um and uh so as you as again I I would expect most people in this room know In the mid-2010s, there was sort of a massive transformation in web development. And we moved from the hypermedia infrastructure of the web to a JSON API. sort of oriented approach. And I would call that approach a data-oriented or an RPC style approach where you're not exchanging hypermedia anymore. you're getting back you're getting back json and so we went from a world where we started getting things like this from the server instead of things that look like this.

Speaker 1: And uh this was you know fed to a typically to a a large JavaScript front-end application. And so by 2020, say five or six years ago, Hypermedia was definitely a withered technology. We'll use the more negative term at this point. People would look at systems that used hypermedia as sort of the old clunky gross way. of doing things and it was about as relevant to web development as a two-bit uh sort of spinach green s uh screen was to video games in say 1999 or 1989 So uh you're all here at DjangoCon and you probably don't want to hear my sob story about hypermedia and how hypermedia kind of fell on our time.

Speaker 1: So how does Django fit into this? whole story. Well, I'm glad you asked. Um Django was initially built, believe it or not, back in 2003 through 2000, it was released in 2005 is my understanding. And it was initially built as a hypermedia oriented framework. So it was initially built to produce hypermedia, to produce HTML. And nobody really thought of it at that time because that's what every that's just what the web was. made web pages. And uh so uh but it was designed as a hypermedia backend. Um it was able to transition into the JSON API era very effectively because it has great tools for doing the things that still need to be done in the JSON world.

Speaker 1: So the ORM, you know, is something I always hear people rave about. It's the Django ORM. And it you build up other tools as well to live in this new world that uh uh kind of emerged in the mid-2010s. But unfortunately, that new world of JSON APIs reduced the role Django played in web development. So the backend began to shrink. The front end began to grow and back ends were often reduced to quote unquote just producing a JSON API And there's always whenever you're producing a JSON API and whenever you have a large JavaScript front end, there's always this thing sitting in the back of the room saying, how come you're not just doing the whole thing in JavaScript?

Speaker 1: If you do the whole thing in JavaScript, you can use the code on the front end and the back end, but you know, there's just this thing sort of sitting there. So yeah, Django can produce or can play in this new world and can produce JSON documents. But I would argue, and certainly I feel about this way about other web frameworks as well, that this new world of JSON APIs robs Django of some of its Django-ness. Some of the great tools that are available in Django and that have been been around for a long time that have been sharpened to a razor edge just aren't as useful in this new world. So what if what if uh instead of asking Django to produce JSON, we did some lateral thinking with uh this idea, this seasoned idea of

Speaker 1: uh hypermedia and what if we've tried to figure out a way to make hypermedia meet the needs of modern web applications. And as most of you probably know I'm the creator of HTMX. HTMX is a hypermedia oriented, thank you, uh front end my ray. Thank you. Appreciate that. If you don't know HTMX, unlike most front-end libraries, rather than uh uh getting JSON from the server, it gets HTML from the server. But instead of getting full documents from the server, it typically gets small snippets of HTML. And HTML is hypermedia, so it is a hypermedia-oriented framework. And the way that it works, again, I'll just give my quick two-minute tutorial on HTMX. um is uh you put attributes like hx

Speaker 1: put uh hx trigger hx target and hx swap in elements in your html And via JavaScript, I'm ashamed to admit, but via JavaScript, it uh hooks in and will make this uh button, for example, issue an HTTP request, an HTTP put. to the like UR uh to the like URL, the relative like URL. And then the content that comes back will be placed in the DOM. So rather than doing a full page refresh like links and forms typically do, not always. There are ways to not do a full page refresh of links and forms, but Um what HTMX will do is it'll issue a request, get back some HTML, and then place it in the DOM according to the attributes that you give it. So in this case

Speaker 1: It's going to take whatever response comes back from this URL, the HTTP put to this URL, and it's going to replace the entire button with it. That's what this outer HTML means. And so at a technical level, what I like to say is that HTMX generalizes hypermedia controls. It generalizes the idea of links and forms. So any element can be in HTML hypermedia control. Any event can trigger a request now. And the responses, and this is probably the most important one, can be placed anywhere in the DOM. So you don't just have this giant screen refresh every time. you interact. Now I'm going to rip through these really quickly because I want to have some time for QA at the end. But I do have sort of my three favorite examples of HTMX to show you what can be accomplished with this relatively simple extension, like small lateral move

Speaker 1: with the idea of hypermedia. So click to edit is one of my favorite examples, and this is an example of a display and form combination. That you want to be able to click and edit something and then save it. And so there's nothing super dramatic about this. There's nothing super dramatic about this. It's just the standard show form and then save it workflow that we're used to. You want me to blow this up? I think I just got it, but please blow this up. So you can uh Edit these things and save them. And there's nothing super dramatic about this except for the fact that that scroll bar didn't move. We didn't go back to the top of the screen. We didn't have our scroll state completely reset.

Speaker 1: And the way that's accomplished. is via attributes that are put on HTML elements. I'm not going to go into the details of it. I would encourage you to go to the htmx. org slash examples web page and it'll walk you through all these things and you can actually see all the requests that are getting made here. It'll show you so we'll give you a little summary of what's going on. But everything is in terms of HTML. So all the responses that we're getting from the server. They're all they're all HTML. They're not, it's not returning JSON like it would in most modern uh web uh with most modern web frameworks. Another example that I think is a cool idea that you can achieve with the relatively seasoned technology of hypermedia is infinite scroll. So if you watch here, I'm gonna hit refresh.

Speaker 1: I think it's If you watch the scroll bar over here on the right hand side of the screen as I scroll down, you can see that more entries are added to this table as I scroll down. And that's all happening if we come here and look at the requests that are actually getting fired off. It's you know page one, page two, page three, page four, the normal paging logic that you may be used to from Django can be used. To produce an infinite scroll UI, which is often considered a more sophisticated user interface, but this is all done in terms of hypermedia. There's no JavaScript that you're writing as an HTMX user And then my favorite example is uh the active search. Um so uh

Speaker 1: you can uh have a search box and uh type something like A E S, I think that's what I typically and it'll filter down as you type. So that's sort of an active search. We've gotten used to that with Google does this in search results. They were were one of the big first major people to do that. And this is all done in terms of URLs and interactions that are all hypermedia based. They're all hypermedia based. And the way that this works is this is a pretty sophisticated example. It uses a pretty sophisticated trigger, event trigger, where it It's uh as people type, it waits until they haven't typed for a second. That's called debouncing and then issues the request. But HTMX with its functionality allows you to define what I consider a fairly sophisticated

Speaker 1: hypermedia oriented user interface just using these attributes So those are some really quick examples, not going into the details of them, of what you can accomplish with just a slight lateral move with hypermedia. So um great what does that mean for Django developers? Well it turns out that uh HTMX and Django go really well together and I found this out uh early on. I used to, you know, back when no one had heard of HTMX I would search for HTMX on Reddit to see if anyone was talking about it. And it kept coming up in the Django community. Not always positively. This This was the first big blow-up post, I would say, in uh in Django.

Speaker 1: And uh the person was asking, hey, what's so great about this? I end up rewriting everything in JavaScript anyways. Um but a lot of people the the responses to it were very positive. And uh so this was what this uh thread and I posted in it and was like, hey, I I made this thing and You know, I'm happy to answer any questions. Just got a lot of positive comments from Django engineers about it. And I recognize, oh, okay Well why? Why is Django why is the Django community loving HTMX so much? Why isn't my native Java like I'm a Java guy for the historical reasons. How come no one in Java cares about HTMX and the Django people all love it? Um and the answer is because Django is a great hypermedia oriented server-side system. That's what it was built for. It was honed to a razor's edge. to produce HTML.

Speaker 1: And so unlike the Java community, which can easily get lost in the sauce of patterns and callbacks and all the rest of it, right? Like you guys know the web and you like the web and you build web apps. You know what the web is. And uh so I think that's why uh the Django community and HTMX sort of got together and uh and worked so well together. One thing that definitely really helped, and if you've never seen it, the 2022 presentation at DjangoCon EU by David Guyot. I'm gonna butcher it, I'm sorry, I'm from Montana. He gave a presentation with his team's experience with HTMX. And again, I highly recommend that you check this talk out. They moved their Django, they had a Django backend with a React front

Speaker 1: end. And they moved it to HTMX. And uh the numbers are very eye-popping. Now this is a this was a sort of best case scenario for hypermedia. And I have an essay up on my uh on the website and hdmx. org slash essays where I talk about when hypermedia is a good choice. And their application was just bread and butter hypermedia, images and text. That was their uh what they were building. But nonetheless, these numbers are pretty insane. So they reduced their code base size by 67 % went down by you know a third of the previous size. Their JavaScript dependencies went down by 96%. Their build time went down by 88 %. Their first time to interactive improved by 50%, and the web app memory usage went down by basically 50%

Speaker 1: So these are big eye-popping numbers. I think one of the most important things for this conference to take away from uh his presentation is that The majority of the code now resided in Django. It wasn't this weird split between half Django, half JavaScript, and having to know both sides to get anything done. So uh everyone on his team became a full stack developer again. And if you, you know, as my beard indicates, I've been around for a while and I liked full stack development. It was really neat. There's something satisfying about building an entire feature instead of just producing a JSON API that you hand off to someone else. So um HTMX and Django, I think, are a great example of lateral thinking with uh let's admit it, both seasoned technologies.

Speaker 1: Hypermedia has been around for a while, Django's been around. For a while. Neither of them are the latest and greatest idea that's coming out of Vercella or whatever. Nothing wrong with those guys. But that's just not that's not what HTMX is and that's not what Django is. But they are mature and powerful and when they're combined together with just this little just this little lateral move with hypermedia. I think it unlocks a lot of power and uh gives uh people the ability to build experiences that they wouldn't think they were they would be able to build. using the tools that have been honed to this again this razor's edge of producing hypermedia. And there can you it can be done at a fraction of the complexity cost. So better battery life if you use HTMX and Django together.

Speaker 1: We have proof that these things work well together. Thankfully that talk by Contexte by David has given us hard numbers. We can see that at least in some cases. It is a massive win. And uh we shouldn't be intimidated. No one in this room should be intimidated. And I would say, especially the young people, um don't be caught up in the hype cycle so much. HTMX went through hype cycle, it's all good. It happens, even the good technology sometimes. But uh but don't get caught up too much in the hype cycle. There are a lot of good, sturdy, existing technologies that have been around for a long time and will probably be around for a long time. And we shouldn't be intimidated by that. We can look to Yokoi's philosophy of lateral thinking, taking an existing technology and applying it to a new con

Speaker 1: in a new context we can uh and keep in our minds that our web apps are mainly about being useful. They're not about having the latest and greatest technology. And I don't have to use the latest and greatest technology uh let's say the latest technology, um I can use t existing technologies that are well known, that are stable, and that have had a lot of time to build up the features that make building web applications delightful and fun rather than worrying about having the absolute latest. absolute latest technology in my tech stack. So we can use season technologies like hypermedia, yes like Django to build these web apps. So um I'm gonna close with a couple of quotes from uh uh uh from Yokoi.

Speaker 1: Um uh these are from this book and I've got a copy of this book here. Um this was a book that was only released in Japan, unfortunately. And uh it's out of print now. Um so uh don't chase tech, chase fun. I think that's a good thing to think about in general. Design is communication, be useful. As engineers, that's probably the number one thing. Like let's be useful. Let's actually make something that makes the world better. And uh fail forward. And uh by the way, he he did have a failure, a pretty serious failure. There was a system after uh the Game Boy um that uh that used goggles. It was kind of too early for the 3D, and maybe still three too early for the 3D revolution. Um and uh so he uh not all of his stories are success stories.

Speaker 1: Um but uh he was always trying to fail forward and he was always trying to focus on building things that were fun. So this book again was released in Japan, it's out of print. um unfortunately. Um and uh it's never been translated into English and it's it's too bad that no one's ever bought one from Japan and run it through OCR software. And then fed it to an LLM and asked it to create an English summary of it. But it'd be great if that if that ever happened. So uh that's lateral thinking with seasoned technology, and this is the main book that outlines that as far as I'm aware. So I can't read it, but so So that's it. Thank you. And thank you for having me. And I hope you guys have a great conference. I'm only going to be here for today, but I will be out in the hallway, kind of wandering around aimlessly.

Speaker 1: And I am going to try and cut an HTMX release today. So if you find me, we'll try and get one out uh out the door today. So and I was told there would be a QA QA stop. How am I for time?

Speaker 2: Do we have any questions? Any questions for Carson? Uh

Speaker 3: what can Django do to better support HTMX and or like with other frameworks that you feel like embrace HTMX, like what could we do better to match that?

Speaker 1: Uh yeah, I think the biggest thing, and it's already been done uh was uh template fragments, which I think are already in Django. Um so the ability One thing that, so because HTMX encourages uh hypermedia interactions, um, one thing that you end up doing is sending back small snippets of code. And uh the way that was traditionally done, small snippets of sort of partials is what people sometimes call them, the way that was done traditionally was to pull that bit of c uh HTML out to a separate file. And so you'd have you'd end up with a bunch of files. And uh the downside to that is that now you lose locality. Because you're looking at a template file and there's a reference like an import or an include of another file and you gotta jump over there and then it includes them.

Speaker 1: It just gets kind of out of hand. And uh so what you want to do instead is uh or one uh alternative idea is to be able to mark content in a template is and give it a name and then be able to render just that bit of that template. And uh that's uh an idea uh called uh uh called template uh template partials or uh um what's the other term for it? Hold on. I've got to look it up. I wrote an essay on this. What did I call it? This is why when you get old, yeah, template fragments. When you get old, write everything down. Trust me. Trust me on that. So template fragments. I wrote an essay on this and uh uh a lot of systems have picked up on this idea and integrated it in Django has. as well. So I think that's probably the biggest thing. But then everything else that would help HTMX would just be what

Speaker 1: something that makes Django a better hypermedia. server. And I think that uh also makes it better for other alternative hypermedia oriented systems. So uh unpoly for example is an exam uh is uh uh a really good um hypermedia oriented front-end framework that does uh um progressive enhancement really really well does it actually better than HTMX in a lot of ways. HGMX is focused on this idea of generalizing hypermedia controls. Um and so it's really narrowly focused on that. Whereas unpoly, the the big idea with unPauly is uh progressive enhancement. And so I would call that uh them best enhancement. class. And I think that's another thing that it came out of the Rails community, but I think if you don't like the cut of HTMX's

Speaker 1: jib, then uh maybe take a look at Unpoly.

Speaker 4: Thanks for the talk. That was great. Um I wonder if you could talk a little bit about the like community management aspects of that we're going to be left behind if we don't embrace whatever, because this has been a thing that has come up in the Django community. over and over and over and over again. And like it's I I think philosophically the bulk of the community is cl close to, you know, where you are with the idea of embracing seasoned technology, but but some people aren't and especially newer people often come in and and are like Django is dead if we don't embrace non-relational databases.

Speaker 1: Right. Right.

Speaker 4: You know, and and I wonder if you can talk about how you sort of like If you have ideas about how to sort of like gently bring those people into this hype type of thinking, this type of philosophy.

Speaker 1: Yeah. to talk about it. And particularly, you know, I say in the Grug Brain essay, I talk about fear of looking dumb. There's also fear of looking insufficiently like sophisticated in uh web development. Um and so I think we can uh uh the the first thing is just to talk about it and uh to acknowledge that fact. And I do have to say, you know, it's not The fear of being left behind in technology is not an unfounded fear. And you can ask Perl developers from 1999 about that because Perl was the web. in 1999 and then Java came along like a meteor and just you know crushed it.

Speaker 1: Um and uh so It's not an unfounded fear, but I also think some confidence in the the old these old and good ideas. um will help. And so you know one thing I've tried to do is talk a lot about hypermedia and the the underlying ideas, less focused on HTMX, more focused. on the idea. The ideas are going to survive. Hypermedia is is a great idea and it's going to survive. And Django similarly has just it's uh you know maybe we want to focus more on how polished it is and uh and and the functionality that it has and its ability to produce hypermedia so easily um and uh try and communicate that to the youth. I don't blame the kids. I blame the parents, right? You don't blame the kids, you blame the parents

Speaker 1: So I think it's up to uh particularly the more senior folks out there to uh to explain these ideas to the youth, to not be intimidated by the new new thing. You kind of have to accept the um you have to accept the news cycle is what it is and the hype cycle is what it is. I behave pretty erratically online in order to get attention for what is uh a somewhat boring uh concept of hypermedia. I can't recommend that for everyone, but if that's your personality, maybe that'll uh that'll work. That's been pretty effective for me. But you know, it's also a lot of right place, right time. So I do think good ideas tend to stick around. Um and uh so I think you know if you the nothing succeeds like success. So probably the last thing I'd say is just go and build, you know

Speaker 1: Yeah, killer software with Django and let the results speak for itself.

Speaker 5: Hi, I'm Natalia. Um I help maintain Django and I'm one of the People that have merged partials into it. I really like I really like HTMX. I really like uh Diango, I love it. But I see a challenge when it comes to testing. Um so I've I've never done have JavaScript. I'm very ignorant. Uh I don't wanna learn. So but there is also a

Speaker 1: I've learned quite a bit about JavaScript to avoid writing JavaScript.

Speaker 5: fully getting full responses back, you can do the you can use the Django test cases and you can do the like default get bust and assert everything that you want regarding the response. Is there a way to include within that traditional or withered uh approach uh HTMX into that? Like with the infinite scroll that you've shown or the active search? It is

Speaker 1: having it to use. Yeah, yeah. It is harder to test. There's no doubt about it. You can test the endpoints um individually, but often you're especially with those end-to-end tests, you're more concerned about the totality of the experience. And the reality is that The power of HTMX is uh just that it can respond to new events and it can do more interesting things with the response content. So it's inherently a more complicated, like one of the great glories of the web is the early web, was that you got a new page every time and the old world went away and there was a new world and that was it. And so you could do something and assert something about the state of the new world. And that was it. I often say that what web developers don't appreciate, the most underappreciated aspect of the web is that we no longer have to do undo

Speaker 1: anymore. Like we just gotta like if they're just like, oh, I have an application, yeah, like I did something, how do I undo it? Oh no, no, that doesn't work. That's not a thing anymore. Like the amount of complexity that saves us as developers is unbelievable. So that's a strength of the old uh web approach that I I think I just have to acknowledge goes away a little bit with uh HTMX. And so your testing has to be more dynamic. You have to be able to say things like click on this element and then wait for a response. And there are ways to hook into the HTMX. request lifecycle. So if Django was willing to look at that, there are ways to hook in and like wait for a response from HTMX before you make an assertion about the screen, but it's just going to be more complicated. That original model of the web You've got the state of the world, you make a request, you get back a full document that is the new state of the world

Speaker 1: was very powerful. And there are times when it's more appropriate, I think, than HTMX. Like, you know, for uh for many cases I would recommend just doing that rather than using HTMX, but use HTMX and maybe the 5% of the application where it makes sense. You need a little bit more interactivity and maybe accept that testing that little bit is going to be a little bit harder. And you know, just make that trade-off. That's that's the engineering trade-off that especially more experienced engineers should just, you know, get good at making.

Speaker 5: Makes sense. Thank you.

Speaker 2: Do we have any other questions? See one back here? While I walk over there, what's your favorite Game Boy

Speaker 1: game? Favorite Game Boy game, um Final Fantasy, what was the Final Fantasy? I spent I I think it was three or

Speaker 6: Um in compared to Intercooler, um HTMX just um went far beyond and intercooler was much less uh popular.

Speaker 1: Yeah.

Speaker 6: What would What have been your gross hacks to make HGMX so popular compared to Interpooler?

Speaker 1: I got really so the my first suggestion is be very lucky. Like that's that's probably no, I said this I gave a talk at Big Sky DevCon la uh last year. Um I think you have to the technology goes in waves, things become popular, they become less popular, they come back And uh so uh Intercooler, which has been around since 2013, um, was not nearly as popular as HTMX. Um they're conceptually very similar. Intercooler, the predecessor to HTMX, was Based on um jQuery, another seasoned technology that no one should be ashamed of using. I think they're releasing 4. 0. 75 % of the web runs on jQuery. So uh uh not a bad technology to pick. Um but um I just think it was timing.

Speaker 1: Um the industry had to go through the experience of single-page applications and JSON APIs and see the downsides of it, get to a point where enough people had seen the downsides to recognize there's you know there's uh uh sort of a dialectic here You know, the web was all hypermedia and then for a little bit it was all JSON and now you know maybe it's moving back a little bit. Um so I think uh I I that is coupled with the fact that I got very lucky And so a couple of big influencers picked up on it, Prime and FireShip Dev both did uh you know presentations or talks on it, video posted videos on it almost at the same time So I was very lucky, but one actionable item you can take away from

Speaker 1: uh luck being so important is uh to stay positive. and to stick around because if you're negative, if you're constantly trying to bag on other frameworks or whatever, um that that negative energy tends to eat you up. And uh it tends to knock you out of the game. And that kind of happened to me with Intercooler. I just stopped pushing it as much because I kind of was like, ah, no one's that interested in it. But uh when I rewrote Intercooler's HTMX and I remember the jQuery dependency, I just said, you know what, I'm gonna be, first of all, I'm gonna be super crazy online. And uh I'd always been a little bit silly online, but I, you know, I just felt like I was holding back. So let's just put it all out there. Um and uh and then secondly, just be unrelentingly positive about HTMX. and not be negative.

Speaker 1: I d I am negative every once in a while about some of the other approaches, but I try not to live there because um if If luck pa plays a big factor in when things become popular, then uh the what you can do is you can hang around. So if you increase the amount of time that you're around then the chance that you get lucky at some point goes up. And then once you get lucky, you kind of over the hump, okay, now you're in a new situation. And so that's the big takeaway for me was, you know, I when I did HTMX uh intercooler kind of flat line there wasn't a lot of talk about uh uh hypermedia or intercooler these things that I cared about And I just did it cause it's like I just love the game and I just love this idea and now we can do it without depending on jQuery because browser

Speaker 1: APIs have gotten a lot better. And if I just stick around and keep being silly and like pointing out the strengths of this approach, you know, maybe at some point it'll catch and then it caught. And so That's uh about the only actionable item that I can come up with from my experience because I can't really get from a from a API standpoint the technologies are very similar. one another um and so i think uh just right right place right time um so that means stay positive about whatever you're doing so

Speaker 2: All right. We have time for one more quick question.

Speaker 7: Oh, perfect. Awesome. Yeah, can you tell about uh real experience building production application, especially like organization. Do you have components or you Don't use this concept anymore with HMX and copy pasting additional directives everywhere or

Speaker 1: Yeah to me components were always just a server-side include Because I think in terms of the search, I've always done that. I programmed in Rails for a long time and then Java for a long time. And so I've never been as I've never been as impressed with the sort of isolation concepts that you see. Like a lot of people who are really passionate about components get really excited about the isolation. of components from one another. And then I see these screen caps captures of like a thousand use effect like calls in a row in order to keep the components all working together. And to me it's like, I don't know, maybe a global variable Um so uh so I'm not as passionate about component oriented programming as a lot of people are.

Speaker 1: I just that's uh the the fact. Now I have worked on large um HDMX applications and we do have have you know we reuse the there's the reuse aspect of components as well and the way we typically achieve that is by either pulling out something to a shared template or creating a depending on your uh templating language, creating a macro for it. And so so I don't think that not going all in on components means that you copy and paste everything. But it does mean that you're not maybe not as uh uh enthralled with the idea of isolation of various components from one another. in a UI. So um so I don't, you know, I've worked on large applications. I think hypermedia scales. I've got an another essay I'll point you to

Speaker 1: called Does Hypermedia Scale that talks about the various sort of meanings of that word scale. And I think hypermedia can scale. I don't want to say a component oriented approach is always bad and HTMX does work very well with web components. So if you want to use web components for that isolated sort of uh uh uh concept you can use those with HTMX um but it's not baked into HTMX the latest baked into some other system. So

Speaker 2: All right. Thank you so much, Carson.

Speaker 1: Yep. Thank you. I'll be in the hallway if you want to come out and say hi. And uh I'll try and cut a release of HTMX today. So we'll see.