Minko Gechev talks with Ward, Dan, and Craig about the state of Angular in early 2021. What changes have been made to the debugging tools in Angular? What are the goals for Angular?
John Papa @John_Papa
Ward Bell @WardBell
Dan Wahlin @DanWahlin
Craig Shoemaker @craigshoemaker
Minko Gechev @mgechev
Podcast editing on this episode done by Chris Enns of Lemon Productions.
Craig Shoemaker 0:04
Welcome to web rush, the weekly talk show that brings you Stories of Real World development from industry experts. And developers like you and me. Each week, Ward Bell, Dan Wahlin, Craig Shoemaker, and John Papa, find out what it takes to write, deploy and maintain apps that stand up to the demands of the real world. And now, here are your hosts.
Dan Wahlin 0:29
Well, welcome to Episode 124 of web rush, everyone. We are excited to be back with you talking about all things web. And I have my glorious co hosts on today. Ward Bell and Craig Shoemaker Ward, what do you been up to?
Ward Bell 0:47
Well, I am deep into this audio videos stuff and my mind is just POW. It's just overloaded. But, you know, and I, I have to remind myself, it's not just age. You know, this is just a lot of information. And there's a lot of angles to this stuff. So
Dan Wahlin 1:08
I think that's why glorious came to mind war, because compared to your previous camera setup, and I know people can't see this audio only podcast. It's pretty amazing. You should see Ward he's looking pretty amazing right now. So
Ward Bell 1:23
yeah, well, I've rubbed some Vaseline. Vaseline on the lens. You know, I got to make myself look pretty now. Craig, what
Dan Wahlin 1:30
about you? What
do you been up to?
Craig Shoemaker 1:31
Well, I've always wanted to grow up and be like Ward, but now even more, so.
Dan Wahlin 1:36
I know.
Craig Shoemaker 1:36
I know. Cuz he's got all the awesome gear. No, I Well, I've been up to about six foot.
Dan Wahlin 1:42
Nice. Yeah, that's a I think that's about an inch less than I remember you at Is that right?
Craig Shoemaker 1:48
Oh, yeah. It's been too long since we've seen each other in person. That's right.
Ward Bell 1:52
I used to be six, eight, but I'm shrinking.
Dan Wahlin 1:55
Ah.
Ward Bell 1:56
But 556 now.
Dan Wahlin 1:59
Excellent. So we are super excited to have Minko Gechev with us. And if you don't know Minko he's done amazing things. He's can't remember the name of it. , I have to admit you're one of the favorite people I follow on Twitter, because the tips you give are amazing, but let me tell you a little bit more. Minko is leading the angular devrel team at Google. And before working on open source full time, he co founded rhymed calm, which Coursera acquired in 2019. I don't think I knew that Minko. Congrats on that. That's pretty exciting. So first off, welcome to the show. And tell us I know, kind of what you've been up to because of Twitter. But what have you what's been going on your way?
Minko Gechev 2:41
Yeah, well, a lot of exciting Angular stuff we have been working on both like products and community side of things recently. So currently, I've been very highly involved in improving the debugging experience for and you're also making sure that your applications perform work well, according to like core web vitals like the user centric search metric, user centric performance metrics coming from Chrome, and a bunch of viral things starting its RFC process on dangerous sites, going to some community, other community initiatives, just running different surveys to understand what people would want to see an Angular recording video, like pretty much all of us.
Ward Bell 3:27
Now wait a minute, wait a minute, I heard that Angular is dead. It's only being used internally at Angular, they've cut themselves off from the west to the rest of the world. And that's so not true.
Minko Gechev 3:42
Yeah, I haven't heard about it. Well, I haven't heard that.
Ward Bell 3:46
There are people who say things like that. So I we want to know, we want to know what what the what you know, what's going on?
Unknown Speaker 3:54
Yeah, social media is a dark place. I have. We have been, angular has been doing pretty well, actually, we looked at we are running an annual developer survey. And last time, we got about 30,000 responses. That's like only Angular developers. Yeah, we released our survey results. So like, it was hard to analyze all the open ended answers, right, you can imagine 30 1000s of them. We run some we worked with the vendor in order to make sure that we provide we run some natural language processing on them so that we can categorize them in different areas of focus. And we released survey results. on our blog about a month ago, I was really happy to see that more than 50% of people actually read it anywhere with a nine or a 10. Out of out of 10 Yeah. And they were I think about 6% of people who rated it with less than a five. So we have pretty good feedback from the Angular community.
Ward Bell 4:56
And yeah, that's people who actually use it as opposed to people who are Who throw darts at it from across them?
Unknown Speaker 5:03
Yeah, yeah, yeah. That's, that's one side of the things, it's really hard actually to measure the exact usage of a front end framework that is being distributed for free, like, empty, just like a JavaScript file that you can add to your application. Right. So one of the metrics that we should be looking at is also a number of NPM downloads, which is very inaccurate, because the majority of Angular users are actually enterprises that have their own private registries. Still, we observed significant growth there as well about 40% growth in 2020. Which is, right, yeah. Yeah. What's that?
Dan Wahlin 5:44
What you mentioned debugging there.
Because, you know, that's, that's an area that honestly, I don't think it matters, what library or framework I use, it's challenging sometimes.
What,
what are some of the things going on there? Because I know, you've also done a lot of, you know, have deep insight into the compiler and all how all that works, too. But what are some things going on in that area that you feel are? I don't know, big productivity boost? Maybe
Unknown Speaker 6:09
depths? Yeah, we had, yeah, I had some my side projects, which we're building on top of the compiler to allow you to explore your application, even in the three dimensional spaces. That's kind of like, I think, working on my colleague, Jeremy corsets discount of unnecessary inventions. So it's kind of true. Yeah, on the blogging sites, in my like, no spare time. But in my job, currently, we're working on a couple of initiatives. One of them is just to improve the error messages for everyone. And this includes primarily newcomers to the framework. So what we released as part of version 11.1, I think that was just a few minor releases back, we released a brand new brand new error messages. So the top certain amount of error messages now have a URL associated with them and the unique code. So when you follow the URL, you're actually going to in your IO, where you can find a guide, that's includes a short video about two to five minutes on how on what this error message is all about, and how you can fix it. And also, actually, oh,
Ward Bell 7:16
that is wonderful. That's that was something that I, I, you know, I used to be involved in the documentation for Angular some years ago. And that was on my wish list for a long time. That's, that's really a great thing.
Unknown Speaker 7:30
Yeah, you can look at the stuff at Angular IO slash years.
Ward Bell 7:37
So john, one of the things I like about ag grid, which is a data grid component for the kind of complex grid scenarios that we encounter all the time in enterprise apps, one of things I really like about it, is that it works for a variety of frameworks, angular react view, or, or just vanilla j. s,
John Papa 7:57
Does that ring a bell for you? No, it really does. There's all these different companies that I work with, where they have no choice, but to use a lot of these different tools, they have different teams working on them. So being able to port their code or share that code, that technical investment they have is really important to them.
Ward Bell 8:14
Now, it's important to us, I do believe we're a consulting company. And I, you know, we never know what our clients going to want to use Angular react view, but they're all going to need a grid. And it's great to be able to reach for the one grid that works everywhere, ag grid,
John Papa 8:28
you know, at any size company, too, because you could have these teams that maybe they only use one framework, but eventually they're going to switch to another one and be able to take that investment again and use it reuse it is really nice.
Ward Bell 8:38
So if multi framework, data grid makes sense to you, please go check out ag grid at ag dash grid.com.
Craig Shoemaker 8:48
What are some examples of the types of errors people might encounter that they'll be able to see a video and have these rich experiences with? Oh, we
Unknown Speaker 8:56
have the infamous expression changed after checks. That's one of the one of my favorite ones, I'll say, Yeah. Does video currently has the highest the largest the highest number of years as, like not surprised to see that. You can see the circular dependency and dependency injection or no provide no provider founds selection selector collision, nice. A bunch of these. They're both runtime and compile timer, error messages that we added to URLs here. So that's part of the initiative, some on improving debugging. And another one will just to go through all the different error messages that we have in framework and make sure that they're providing valuable information that was the first stage. So that was a improving their errors was secondary guys. Another thing is angular dev tools. So this is a collaboration between the Angular team and the original authors of algorri, which was the previous version of Angular dev tools. Prior to AI. We have been working with them on improving The debugging story for understanding the structure of Angular applications and also being able to profile them more profile and better just by implementing different profiling tools for Angular, which check how long did it take you to see how much time you spent in change detection in particular components? How much how many times you've walked change detection, overall, stuff like that, and will trigger change detection, sometimes it's not obvious.
Dan Wahlin 10:27
That is awesome. Because I, in my role, now at Microsoft, I'm dealing with a lot of different frameworks actually, just because we have to certain things I'm on we have to make them work, you know, everywhere. And in I won't even say it because I don't want to get into battles between this and this. But in one of them, it turns out, there was a ton and it wasn't Angular, by the way, there was a ton of you know, what we would call change detection checks in Angular going on, and nobody caught it until a little bit later, man, because none of us had looked at it to be honest. So I'll take some blame there for not looking at it. So it sounds like you're gonna make that come much more to the surface, then to be able to easily profile it and see those.
Unknown Speaker 11:10
Yeah, yeah, we do. We're currently dogfooding. This extent, it's pretty much a Chrome extension that you can even run in electron application. In general, it's pretty decoupled. So it just, you can even run it remotely. When I think about it. It's just like a synchronous communication channel. We found a couple of interesting performance issues in some really large Google projects that they're using endure internally. And they were not very obvious to find otherwise. But with dev tools, people were able to just run the profiler and see the change detection going on and just like click on a particular change detection frame, and see how much time they spent on each individual component, and what do they do there. And until we get there, because we still want to work on better integration with the framework right now, between dev tools and the framework, we want to establish a good interface for communication. We also release some videos on our YouTube channel. So we have here kind of revamping our YouTube channel to make sure that we're posting content regularly now, it's youtube.com, slash Angular. And you can find how you can debug your application with Chrome Dev Tools. And ultimately, Chrome Dev Tools provides you even more compared to what's in your dev tools is going to, to give you because you can look at the individual function invocations and but at the same time, all this information could be a little bit overwhelming. That's the purpose of dev tools to highlight a little bit of this and show you exactly what you need to see for your Angular apps.
Ward Bell 12:40
Now, is this all YouTube content produced by the Angular team? Or are you accepting outside contributions? How does that work?
Unknown Speaker 12:47
Yeah, what's on the error? Guys? We actually work with farshid bio. I, that's I think the only YouTube channel I'm subscribed to, from my personal account, maybe this one and One Minute Physics when I think about it, but yeah, we work with them on introducing on developing the content for your guides. And aside from that, I think the primary the content is developed by by Angular team.
Ward Bell 13:18
But that's, that's great. That's great stuff. Is there? Is there a sort of a theme for the direction of Angular over the coming release or releases that we should know about? Cuz I mean, you're always fixing stuff all over the place. But often, a framework has a sort of a major initiative that it's working toward a goal. Is there or is there a goal or a series of goals that you're working toward?
Unknown Speaker 13:46
Yeah, a few things. So first, one more thing that I wanted to briefly mentioned was about just being more explicit on what we have been up to in social media, we noticed that at certain point, we had maybe one tweet a month, and this was maybe not sending the right message. So now we were sharing pretty much all the well, not all of them, but a lot of the new stuff that we have been publishing and sharing with developers. And as part of this initiative, we also shared our roadmap, you can't imagine how hard that was actually, because building a web framework is something very unpredictable. We have web moving forwards very fast. There are new web standards being developed. There is JavaScript language, the language which moves forward annually with a new standard proposals. And also the business which moves even faster. So the framework needs to make sure that it aligns with all these different standardization bodies and also fuels the business purpose as well. So it has been challenging, I think, not only for a year, but pretty much for any web technology out there to publish a roadmap for the next couple of years. We did that last year, where you can find the roadmap hold on URL slash guide slash roadmap, we were listing a couple of more strategic initiatives that we'll be taking on in the next like, a couple of months or at least like two years maybe
Craig Shoemaker 15:13
that Can you pull out a few items from the roadmap that you think would be worthwhile for people to look into? Yeah,
Unknown Speaker 15:19
yeah, generally, angular in Angular is vision, we want to be opinionated and to provide best practices from the start. So if you look at that's kind of a common theme between all the efforts in the in the roadmap, something that is coming up soon, is just strict mode, where we'll be introducing stricter type checking for enter your templates and TypeScript code. I don't think it's even on the roadmap, because it's kind of a relatively small effort. Something else in this direction is simplifying the framework. Generally, we want to be opinionated, with best practice from the start, but at the same time to not overwhelm people with a bunch of concepts that are part of their critical learning journey. So this is optional engine modules is part of this vision. That's something that we can do looking at for a while. And we haven't implemented only because it's, we want to make sure it doesn't have braking impact on the ecosystem.
Dan Wahlin 16:18
You know, that was going to be my number one thing I was going to ask you about, because having done a lot of training and stuff like that on Angular over the years, that's always the first thing is what's with this module? Like, why can't I just write a component and it runs? So I'm excited see that, you know, it's a hard problem to solve. because like you said, You can't be I mean, AngularJS had modules, you know. So it's not like, you could just rip those out, and hope that everything works perfectly, because it probably won't. But I'm glad to hear what's going on. What's some of the areas you're looking at there, then like what some more details? Cuz I think that's pretty exciting.
Unknown Speaker 16:56
Yeah, yeah. Actually, when I joined the team in 2018, before that, I've been part of the Angular community. I was thinking about this yesterday, almost 10 years now. That's Wow. Yeah. 2018, when I joined the team working on Angular I was my first pull request was to make ENTJ modules optional, but I wasn't thinking about the consequences that this could have. And like all the implications, so clearly, this, this wasn't able to go through. And we have you planning computer how to make the rollout in a smooth way to ensure a smooth transition, and also to still provide any modules for other large applications which need them because we find them as a really great organizational pattern for large apps, such as, let's say, Google class, which I think they have over 2 million lines of TypeScript right now. And wow. Yeah, we might
Ward Bell 17:47
not have been in that half too much.
Unknown Speaker 17:53
Yeah, just a little bit context about thingee modules. So engine modules primarily exists, because in your house a has templates, which are just like plain HTML, which we later compile to efficient JavaScript instructions. We believe that this static HTML it provides us of it provides some static guarantees that let us optimize it at build time, and making your as fast as we could. And what engine modules do what engine modules do is just like to provide the computation context for this template, they just let you know which components are available in this particular template so that the compiler knows what output it can generate. And the way we're planning to make them optional, is to allow you to specify individual components that a particular template uses directly in the corresponding component metadata. So in app components are good, you have something like depths or imports, or something like that, where you will be able to list all the different components and directories that this component uses.
Ward Bell 19:05
Let me tell you why I think that's a terrible idea. And what I how I think that that can be, you can square the circular that I have absolutely no interest in taking each of my components and figuring out which components I'm using on there, when in fact, I mean, that's one of the reasons I have a shared module, right? Because there I just I say here, here's a grab bag of the things that I might use on any individual component. And I can just know that those are going to be available. When I create my next component. They're all going to be there by their you know, it's my little input things or whatever. And so, if I was required on every component to sort of take inventory, and make sure I listed it would drive me mad. Now, I don't know that and the way Angular modules is constructed today is the best way to do that. It's actually pretty clumsy, as we all know. Well, if you made me put All that stuff in the component minko, I would first I would tear all my hair out, and then I would find you and tear all of your hair out.
Unknown Speaker 20:09
Yeah, that was actually only the first part of the proposal. In the second part of the proposal, we are thinking about letting folks import an entire engine module in their component metadata so that you don't have to list the declarations one by one. And this is going to be much more ergonomic way to go with
Ward Bell 20:26
that. Now, now you got me back. Now it's now like, we could be friends, again,
Craig Shoemaker 20:31
everyone's hair is safe.
Dan Wahlin 20:34
Cuz I need all I can.
Ward Bell 20:36
Yeah, we're gonna go pull all of John's hairs out. But
Dan Wahlin 20:42
I really like to see that though. Because I the way, I'm a big fan of modules for the exact reason you said minko. As applications grow, I'm used to working with other languages and frameworks where they do have what I call buckets, where you can organize things. And without those buckets, I've seen what happens. I'm sure Ward and Craig have to I know you have Minko probably Google alone. You know, for folks that haven't gone that route. use something else maybe. So I think it's a big deal. But I also think for those, especially when people are getting started, or they just want to kind of quick app to just get out there, whether it's prototyping or so it's not a big app, to have to have that extra baggage, I'm gonna call it when all your goal is is to get a few components going, I think that are really lower the barrier to entry, which is probably a lot of what you're after, I would guess. Yeah,
Unknown Speaker 21:37
yeah. So together with scalability, we also realize that some of these best practices, they're, they're critical, and we're not going anywhere with them. For example, TypeScript, this is something that we strongly believe in such as, also same with the compilation that we have in order to guard people from doing frequent mistakes in templates. And having a unified project structure, dependency injection, all this stuff. But also at the same time, we don't have to really introduce all these concepts at once. And we're doing our best to introduce them gradually over time. So that depending on the scale of your your application, you can use only the subset of best practices you actually need. And when with the scaling of your application, you're able to take advantage of other things we have discovered at scale, Google. I'm just getting excited about some other things. Actually, that's that's kind of old news. We read that in 2019. But I see that there is a large excitement, generally in the community, and generally in the web community about that. We are also looking at into but like still not actively investing ads into we call it progressive hydration, which is pretty much rendering your application on the server and right after delivering just plain HTML, just plain markup to the browser, without any JavaScript. So that when, so that zero cost for the user is the application is going to be immediately rendered, but not necessarily interactive. However, when they start interacting with a particular component, we will be able to deliver only the JavaScript associated with this components and all of its dependencies so that we can hydrate or make interactive only part of the year. We did this prototype in 2019, I believe. And we have been moving the framework slowly towards making this available for folks. But clearly, it's like not a trivial problem to solve with JavaScript being a very dynamic language.
Craig Shoemaker 23:42
So you said you're going to serve HTML plain first. But it it's not like it's the JavaScript is off on the browser, like there has to be some JavaScript in there running to say, okay, we now get this component because I'm interacting with something, right?
Unknown Speaker 24:00
Yeah, yeah. We're serving the finishing offers the server side render creation, right. And there's going to be a tiny snippet of JavaScript very much, which, when you start interacting with a particular component, this tiny snippet of JavaScript knows exactly what it needs to fetch from the server catcher is going to fetch only the smallest subset of the application that is required in order to serve this interaction.
Ward Bell 24:24
The goal here is fast load right first time the first page first interact fast time the first interaction, and it does. This is generally we know this is server side rendering, or is that is there a different name that you would go put it under?
Unknown Speaker 24:39
It's server side rendering with progressive hydration? I guess that's the fence that we use. There are different frameworks coded in different ways. Yeah, there is Google i o video from 2019, where we show this in action and it's still like nowhere close to completion. They're still looking into this, but the individual efforts on their own Map are just taking your steps forward this direction without blocking us from achieving this, like optimal streaming of web applications is literally streaming.
Ward Bell 25:12
Yes. Speaking of things that took longer than expected, your has to view engines fuel two ways to Bill, you know, the view, that stuff can appear on your screen. And one of them call is called, I guess who and and one of them was called IV. And there's IV was the future for a long time. Is IV The present?
Unknown Speaker 25:36
Yeah, yeah. He has been the president for the past. exactly a year. I think it's, it's Yeah, it's crazy. When I think about it, we released it in tweet winning. That's one of the few good things that happened in 2020.
Ward Bell 25:51
But that's now the default. Right? And yeah, and watch it. But there used to be a problem with AI. If I had a library that I was sharing. It would still be using the old view engine and how do I integrate it with things I write in IV? And I kind of like left the building about the point that that was? Because that looked messy. ngcc I don't know all these little acronyms. So where is that now? Is that process of building libraries that work with IV easier or getting easier?
Unknown Speaker 26:21
Yeah, yeah, yeah, correct. Previously, we had a compensability compiler that was compiling libraries using the previous rendering to it. And it's working pretty well, but at some extra post install step, so people need to wait a couple of seconds after they install their NPM dependencies. For the step to pass, we released an RFC that was our first RFC. Well, we can be having collar attempts for RFC that was one of the first RFCs for the new RFC process, let's say, where we asked the community for feedback on the new way to distribute IV libraries. So this is something that we it's currently in a roll out, we're going to make it the default in version 12, where people will be able to distribute it libraries without needing to package them, as you mentioned,
Ward Bell 27:11
are you building a web application needs to deliver it soon and don't have the people to do it? Maybe you're not sure your company has the skill set or experience to do it. And maybe we can help. I'm your host word bell. And my day job is building applications for companies like yours. I don't do it alone. I'm president of idea blade, a consultancy that specializes in enterprise web application development. We're particularly strong in Angular RX JS NGR, x Redux, on the front end, and dotnet, Microsoft technologies on the server, or small, tight knit group of people handpicked by me, for their expertise, experience integrity, and team spirit. Maybe we can help you with architectural guidance and hands on development. And if there's something we don't know, and in our field, really, there's too much to know, we can draw on our personal connections in the Microsoft rd MVP, and Google GDP networks, as well as our international circle of really great developers, people we know and trust personally, if you've got a project that's keeping you up at night, shoot us an email at info at idea blade calm. That's info at idea blade.com. And now back to the show.
Dan Wahlin 28:22
One thing I want to circle back to minko was, so you mentioned this, I'm going to call it SS SSR. ph would that be right? server side rendering progressive hydration? Yes. I if anybody uses that acronym, it is now copyrighted trademarked? Anyway,
what what I
know one thing that I first thought of when he said that was, so is that going to be like a complete replacement for what Angular Angular universal does then? Or is this just a new way to do what it does? I wasn't clear on that part.
Unknown Speaker 28:56
Yeah, your universal would not change in this case. I think there is a very minimal amount of changes required there is mostly on the cloud side, how are we going to handle user interactions? And how are we going to load individual components one by one. In fact, this is something we have been using in Google for many years now. Not necessarily for Angular only. But it's actually doable with Angular even today, but it's not enabled. Like it requires some custom work there, you need to put the work into making sure it works with your application is very interesting problem to solve because at the same time, when you think about it, you don't need to bundle your entire application. Since the bonding happens dynamically when a user interacts with a particular component, we need to figure out this components and all of its dependencies and on demand bundle a subset of the application in order to deliver it to the client. And it requires a custom serving infrastructure or Maybe just pushing code over USB two or USB three. Yeah, it's it's interesting problem that involves intersec. Not only actually the client side rendering, but the changes in Universal are going to be minimal. Yeah, university not going anywhere. We have been consistently improving it over the past few few months, we are in an ongoing collaboration with the Google Chrome team. Particularly a team that is very closely working with the folks who are developing core web vitals in order to make sure that Angular is very well optimized, recorded vitals. So this has been an ongoing collaboration where we shipped inlining phones, in mining of critical styles, and also giving feedback to people on the implementation of individual metrics so that we can make sure that they are not penalizing can existing Angular or non Angular applications?
Dan Wahlin 30:58
Let me go a little different direction here real quick. For those that don't are on Twitter and don't follow Minko, you should because you provide some tips. And I'll have to admit, there's been multiple of these tips where I'm like, holy cow, I did not know about that, you know, because it's just these little subtle language things. is, you know, quick segue from Angular here. Is that something you just kind of research for fun on the side? or How are you digging up all these cool tips?
Unknown Speaker 31:29
I'll see it's a mixture between doing just like practically looking for things to learn and share. And also just having some things in my toolbox that I want to share. Yeah, I'm learning some new things around that. Also, for example, what does it's checking whether something is an array array.is array works better than instance of because it works across iframe and stuff like that. That's like crazy, crazy stuff. And it's weird if we have this works in JavaScript on the first place. So
Craig Shoemaker 31:58
on your blog, you have an introduction to who you are, and you have I am and then you have this code block that has this insane array structure in an eval statement, which I ran in a incognito browser, because I didn't know what that eval statement was going to do. And it prints up your name, which I thought was insanely fascinating. But then I'm looking at the code, and I have no clue how that works. So if you're listening, you should check out Nico's blog and look at this. And I was just curious, can you tell us how that works?
Unknown Speaker 32:34
Yeah, you can actually write any JavaScript program with just six characters. With square brackets with parenthesis, exclamation mark and a plus. That's that's how we Yeah, wow. Yeah, for example, when you have square brackets, that's pretty much in the rate. But if you prefix this array with a plus, it's being cast, it's to a number. So it's now zero. If you if you prefix this plus square brackets with an exclamation mark, this becomes true. But when you prefix this with a plus it becomes one. So you can get, let's say, by having zero now and having an empty array, you can very, very easily to get undefined, just xx accessing the zeroeth element of an empty array. And if you sum this with an empty array, you're going to get the string undefined. And from there, you can start taking the individual characters have been defined one by one. You can do the same with objects and infinity. And generally you can start accessing, you can access I think it was
Craig Shoemaker 33:50
you can access the characters associated with specific Unicode code points that you looked for every any error code that had any of the letters that you needed for your named your name, and then use this technique in order to access the the location of the string, just spell out minko. Am I understanding that correctly?
Minko Gechev 34:13
Yeah, pretty much. Pretty much. Yeah.
Craig Shoemaker 34:15
That's awesome.
Dan Wahlin 34:16
Greg, I have to admit, that was the find of the year so far. I'm also just baffled. There's a link in the show notes for everybody. If you want to see this. It's crazy.
Ward Bell 34:25
Oh, I
got that. That reminds me of Gary Bernhardt. Famous JavaScript. Why? Yeah, it's about four minutes long. And it's still one of the best talks ever given. Yes. It's great. So that'll be in the show notes, too.
Unknown Speaker 34:41
Yeah, love it, too. Yeah, the tricky part, I guess, is to go to stream dot from character codes. So that's like from there, you can already get pretty much any characters out there in the Unicode. So yeah, but never forget all these characters. It's like a lot of work to get to there.
Craig Shoemaker 34:59
How long did that Project take you. Oh,
Unknown Speaker 35:01
I did it some time back. I don't remember it was a while. I don't remember it was many years ago, maybe a few, maybe a few days. That's, that's pretty awesome.
Dan Wahlin 35:12
He's blocked it from his memory so painful. Through a memory exception,
Unknown Speaker 35:19
I actually have a translator, yeah, I have something which can translate any string to the Wow.
Ward Bell 35:24
I'll make sure I slip this into some client code and charge them.
Dan Wahlin 35:29
I look forward was just thinking, can you imagine if somebody cuz you can make this work? Obviously, beignets would just be like, what it'd be one of those where you put the comment up above it. And say, every time you change this, and it breaks something, please increment this number, you know, and there, you
Ward Bell 35:47
just got to make sure that the commit is checked in under somebody else's name, you just change the email under the way. It'll look like Dan, while he put that in the code.
Dan Wahlin 35:56
That's all just for the crate. Exactly.
Ward Bell 35:59
So it sounds like thematically, you're just you're really working on Angular use? Well, you're working on performance kinds of things, because I hear that as part of the theme, one of the themes. But it did sound like in the beginning, though, you were talking more about usability and ease of learning. And that that's that there's an effort to do that. And I think that's, that would be really important, particularly the competitive landscape. Where let's let's face it, angular has a, I think deserved reputation for complexity and being hard to learn and things like that relative to say, some of its competitors out there, like view. I mean, React also has this way of starting out simple and then quickly, becoming a challenge and becoming overwhelming to but but Angular kinda leads the pack in a reputation for being difficult to learn and is so is that that's something that the angular Core i get a group is sort of kind of recognizes and is putting effort into.
Unknown Speaker 37:08
Oh, yeah, absolutely. Yeah, absolutely. So there are many initiatives in in in this direction that we're looking at. So really, there are some updates in the learning journey, and in the documentation itself, where we want to introduce this motor. And you're in a smaller way without talking about engine modules and RHS from the beginning, and even thinking about RHS, it shouldn't be part of anyone's critical learning journey. So that's another thing. Another thing we've been looking at, I suppose, documentation, I'll say there, because we have only one abstraction only event emitter, which is an observable, and it doesn't really you folks through the gym, don't need to understand it. This observable observables is a big, big part of it. And optional range modules is another effort. Having more ergonomic error messages, when you get an error message that an expression has changed, stops, race has been checked. That's not the easiest thing to get.
Dan Wahlin 38:08
Every time I get that even after years of Angular experience, I still go Oh, boy, here we go. Here we go down the rabbit hole to figure out what I screwed up.
Ward Bell 38:17
Yeah, time to break out set time up.
Dan Wahlin 38:20
I will say though, Minko, and you probably went through this too. And more than Craig, you might have, back before Angular even hit two. It was you know, the alpha. Literally, there used to be this air. It was like index is is not zero, I think something like and No. And again, this was early, early days, it wasn't even out yet. You know, this was like alpha really early builds. I'm not even sure they were public yet. And I still remember to this day, me and john getting on award, you're probably on those calls to just go. And so where do we start? Because there was no file name? Nothing. Whereas now Angular, I think it actually has really good messages. And obviously you guys are making it even better. That's pretty awesome.
Unknown Speaker 39:05
Yeah. Yeah, I was surprised if we don't have that many years, actually. So I in order to extract all the errors, we had a rerun the scripts were channelized the soldier type script called find themselves where we were throwing error messages and output this into our CDs file. And we went through StackOverflow GitHub, just like general Google search to figure out which are the most common error messages so that we can first target them. And there were not too many there are for sure, less than a hundreds, both compile time and run time error messages. I'll see that there may be around 15 more seconds. Maybe that's a mixture between anger errors, and that's critters as well.
Ward Bell 39:47
I am curious about what you were just saying a minute ago about RX js. Now. Let me preface this by saying I am. I consider myself I use RX JS heavily I consider myself pretty good. It added, it took me about two years of daily use to get to the point where I would describe myself as better than the average programmer with RX js. But it's just kills everybody who's working on the team who doesn't live in and breathe it. And I, it's so it's so powerful and rich, but I have a feeling that we could use it with a lot less of it in the code. And I'm sorry, I apologize to everybody I've worked with that I have forced so much rx jassa. So, with that background, it sounds like you're Oh, and I should also say, at NC comp, which is the year League, big conference around Angular, I was looking at the talks that have been selected. And as usual, about it feels like 50% of the rxjs talks that said to me, so So you guys are gradually steering people to await you know, originally, we seem to be steering everybody towards our x j. s, all the things. Now you guys are sort of backed off that a little bit and made it made a softer entrance into it. And we're not, you know, are we not demanding, you know, of all of our developers that they immediately do everything in our ext JS? Is that the new trend? Yeah,
Unknown Speaker 41:22
this is reasonable. I have a similar experience with it's like, it's very expressive API. So you can have very beautiful and elegant solutions. But at the same time, there is very specific semantics between a very short word like very short operator, and it's like not obvious what this does. And especially when you buy a bunch of them together, it's even less obvious. It's similar to Haskell. I like functional programming languages and more, I guess, he's terrific ideas.
Ward Bell 41:53
Yeah, there's they're intellectually challenging. I love trying to get the type flow right through all of these things. And after I've spent a good six or seven hours getting that just right, and solving a problem I could have solved in two seconds for another way. I feel like that was really six hours well spent, but nobody else does.
Craig Shoemaker 42:13
As long as you're killing
Ward Bell 42:14
Yeah. Well, yeah.
That's the thing, Craig, I
wish I could feel for that. But I immediately feel guilty. And I just write those hours.
Dan Wahlin 42:23
Don't you build by operator or?
Ward Bell 42:29
You write Haskell is a good example of that. You just feel so alive when you're writing in Haskell. But everybody else thinks you're nuts.
Unknown Speaker 42:38
Yeah, yeah, we already Jeff, I guess it's cooler. We are, we definitely are not pulling back. It's definitely we will have space for improvements between the integration of Angular and rhs. And there are some things that we're planning on doing in this direction. But this doesn't necessarily imply that more API cinavia are going to get more coupled with RX JS itself, we can just understand better observables and handle these, this transparently, internally for developers. Rather than introducing more RX JS API's to the public API surface.
Ward Bell 43:13
That was a great relief, that's going to be a great relief for the Angular community, honestly.
Unknown Speaker 43:18
Yeah. Yeah, I'll just get to see it, it's here as a good opportunity to support not only the folks who are getting started with Angular, and don't necessarily like or want to use rxjs, and also the folks who love to use rxjs. And they need more friendly, ergonomic syntax.
Dan Wahlin 43:36
And that's exactly what I was about to say is, I think your work with, you know, simplifying the whole module approach, and then what you just talked about of, there's still observables, but you don't have to be a guru, like Ward Ward is my go to guy. By the way, if I have an arc JS question, I ping ward. You don't have to be Ward Bell, though, to start building things. Because, you know, when you're coming from a lot of these other areas, you pretty much learn promises, and you're good to go. And we all know promises, you know, especially with streaming types of data, I think, you know, WebSockets, for one example, promises aren't as cool there as like observables. But at the same time, I think there's a lot to be said about simplifying and, you know, I think it all comes down to lowering the barrier to entry. So that's good to hear.
Craig Shoemaker 44:22
Yeah. So minko is there anything that's on your wish list that maybe isn't on the roadmap yet that you would love to see in Angular?
Unknown Speaker 44:32
There are a few things. The first one is the streaming rendering that we discussed. It's not on the immediate roadmap but this is still something that we're going to get to eventually something else that will
Ward Bell 44:43
follow back up with what is streaming rendering streamed right now
Minko Gechev 44:48
is a progressive hydration Sorry, I'm use a
Ward Bell 44:51
different term.
Dan Wahlin 44:52
Yeah, expand my acronym less now. SSR. Goes to I don't know what
Unknown Speaker 44:59
Yeah, I'm thinking At the streaming rendering, because your applications like streams to you, it comes like on pieces to, depending on your interaction. So it's similar to, I think about it as video rendering to certain, like to certain extent. And another thing that we haven't looked into, it's really cool idea, though, but there is already some exploration in the community s concurrent rendering of your application. So pretty much figuring out. So yeah, Chrome, Chrome is working on experimental scheduling API where you could schedule tasks with low high or medium priority. And this provides opportunities to render parts of the UI with higher purity than other for example, something that is visible in the viewport, we have higher purity compared to something that is outside of the viewport. And there are some community, there is some community work actually, in this space? Michael hotkey has been he actually implemented concurrent votes concurrent rendering to newer. And yeah, that's a really cool idea that you could look at,
Ward Bell 46:04
oh, there's something like that in react, I'm trying to remember the name for it. What were they do that kind of prioritized? work and time slicing? I can't remember the name of it.
Minko Gechev 46:14
The the current law, right?
Ward Bell 46:17
Yeah. It could be that it could be that Yeah. Too many angles.
Dan Wahlin 46:22
So lastly, wanted to ask about minko. I know, I used to always hear the numbers about internally at Google, how he was being used. And I think we mentioned earlier, just Google Cloud alone had some pretty massive lines of code with this. But what is the story, you know, nowadays in Google with the angular adoption and usage?
Unknown Speaker 46:43
Yeah, it's. So that's both. Like we're very happy with it. And also, it's kind of a challenge for us, because we manage older. And your applications as well, we pretty much make sure that all the applications are keeping are kept up to date. We currently have, I believe, about 27 to 2800s. And your apps. And they vary from small shopping lists, for example, Google, Assistant, Google systems, shopping lists to submit your application, the web version. And that's one of the I guess, on the smaller scale to something large, such as Google Cloud Console, which estimation to realize, of course, and we have a lot in between, for example, the culture of your system that we're using on daily basis internally, it's implemented in anywhere. Cold search, that is the functionality for looking up source code in our moderator is implemented in there are a lot of infrastructure critical projects are currently built with Angular. And we have a few established frameworks. Well, a few set sounds to me, there are fewer than that I'll see. Let's see two official frameworks. And I'm sure there are other other folks were implementing their applications in other technologies as well, that's in I'm currently working in core developer web. This is the organization that manages the web infrastructure in Google and and your and with that is yellow technology. We are the most commonly used web technologies, I'll say, where Angular is currently the most popular web framework ads in the company.
Ward Bell 48:24
One of the one of the things people may not know, is that every time the Angular team comes up with a feature or a fix, or does anything pushes anything, you guys rebuild every single Angular app at Google, if I recall, and if it breaks any of those, then there's a mad scramble to go back and do it. So so the angular we consume out here has been tortured by every Angular app at at Google. Is that true? still true?
Unknown Speaker 48:55
Yeah, yeah, that's the fun part. Well, maybe not the soul fun part for us, because it requires a lot of work on our site to make sure that each individual push coming from an Angular team member or a community member goes through internal validation, where we have hundreds of 1000s of test targets that running across these 1000s of applications. And we make sure that none of these test fails, and your is going to be as backward compatible as it was before the change happened. So this is
Dan Wahlin 49:29
obviously one of the biggest powers of being backed by Google that we have access to this internal monitoring repo where we can ensure that we have this enormous test coverage. I've always viewed that as a major, major benefit because like Ward and Craig with various companies we've been with in the past or worked with having that confidence level. I guess, that first off, it's not going away, right, because it's just used too much internally for that to happen. But second off, that there's this magic have massive use internally so that the testing, like you said hundreds of 1000s of sound like targets for validation that I mean, that's a big deal. Because in addition to all the community validation, you have all this internal stuff we never hear about,
Ward Bell 50:13
right? It's all automated. Like, yeah, you know, it's when you break something.
Yeah,
I remember when I was there, it was a bad scramble the big red light goes on. And, and so that's, that's a curse. I
Dan Wahlin 50:25
was like, Oh, yeah.
Ward Bell 50:28
Oh, yeah.
Unknown Speaker 50:29
Yeah, yeah. When you break something, you go there and fix it. And it's fun to look into an application you've never seen before, and tried to figure out what breaks and why,
Dan Wahlin 50:40
and why that's fun in air quotes on that one, right.
Unknown Speaker 50:45
But gather the tuning. We haven't turned in a video support support as this they darn well reports this huge ci that is able to understand, like all the all the applications that are impacted by certain change. It's Yeah, it has been really helpful. That's great. Well, we
Dan Wahlin 51:03
really appreciate you coming on Minko and sharing all your knowledge. I think, you know, whether a developers Angular or not listening, I think it's great to hear about what are these plans, whether it's, you know, the performance and profiling or the simplifications that are planned, and I love it, it's great information that I think we can all benefit from. So thanks again, for coming on. Before we wrap up, we always like to do our kind of Final thoughts, where we'll just share some things we've been thinking on or working on or whatever. So Craig, let me start with you. What are your final thoughts for today,
Craig Shoemaker 51:38
I'm going to echo something you said we kind of just steal an idea and just say that, follow minko on Twitter, because in addition to everything that we've been talking about here, those tips, the JavaScript tips and TypeScript stuff that he puts out, there is just, you know, certain things that you may never even think of how an operator acts or how a property works, or whatever, he kind of uncovers that makes it available. And it's it's pretty cool.
Dan Wahlin 52:07
Yeah, and you know, what I love about it, Craig and minko said, you did it is you do it real professional, you know, I don't know what you're using to produce it. But it's like, really nice, side by side. And so yeah, keep keep those tips up. Because I learned a lot from Ward, what's your final thoughts for today?
Ward Bell 52:22
Well, staying in this area. I I want to say that, that I find this encouraging because if you're using Angular today, you don't have to be shamed about it. There's a lot of buzz out there about you know, I love me all the other frameworks too. I you know, I want I want to do react and, and, and view, fast fouls and all that other stuff. Totally intrigued by all that. But I I don't have to suffer from framework envy or worry that I've made a terrible choice. I you know, Angular is still a really solid choice. That's awesome. Minko,
Dan Wahlin 52:59
any final thoughts forums? Oh, yeah, sure. So
Unknown Speaker 53:02
something that was, I guess it's going to be an update from the angular side of things. And something that the community was really excited about recently was that we actually run a survey, public survey to ask people what new things they want to see in dangerous Eli? And the answer was that they would want to see better integration with tailwinds. And yeah, we have dealt with integration stars this last week. So yeah, you're welcome to use it. This has been a really high feature from really high demands. And we're now looking into ways how to better showcase how to take advantage of it. It's pretty much just adding tailwind to your project and adding your tailwind config, but we want to have some more videos and potentially streams around it. That's awesome.
Dan Wahlin 53:52
I've been playing with tailwind a little bit. And it's, you know, it's a completely different approach. But I really like it because I just don't write as much Custom CSS classes. So really nice. Let's get here. My final thoughts I swear over the last few months minor always related to something I'm personally working on. So one of the things I try to do, too, you know, I'm, like all of us pulled in a million directions every day like this meeting, then this meeting and then got to work on this and you know how it is. So I'm trying I've been doing this for a long time, but I've kind of slacked off lately, especially towards the end of 2020. And that is either at night or first thing in the morning, defining what are the top three things I can do for today. So at the end of the day, I actually feel like I got something done. Because there are so many days where maybe it's just me, but you get to the end of the day and you're like well that was a waste because you just don't feel like he got things done because you were pulled so many directions. So if you haven't tried that before for folks when I have been Pretty religious about doing it like either every night, which is even better, I think. Or every morning. It's amazing how much more like fulfilled you feel at the end of the day. So something to try out if you haven't done that, and these are big goals. These are like really? Oh, Luke Craig, people can't see Craig's actually holding up a sticky note with his things for the day. I think your daughter just scribbled that on Craig because it's blurry and we can't read it. I don't think I have put on shoes breathe and eat. I'm feel accomplished for the day.
Ward Bell 55:32
put on pants. That's
right. Yeah,
Dan Wahlin 55:33
gotta start you got to start somewhere. So with that face again, minko Thanks, warden. Craig's been great talking with everyone. And for all of you listening, check with us every week for the next episode of web rush