JavaScript Jabber

JavaScript Jabber is a weekly discussion about JavaScript, front-end development, community, careers, and frameworks.

Subscribe

Get episodes automatically

236

236 JSJ Interview with Mads Kristensen from Microsoft Ignite


TOPICS:

4:00 Things that make web development more difficult

7:40 The developer experience with Angular

10:40 How cognitive cost affects the user experience

16:52 The variety of users for whom Mads’ software is built

22:14 Creating accessible javascript tools that aren’t immediately outdated

28:20 Why people shouldn’t be using dependency installers

34:00 Node updates

QUOTES:

“The massive introduction of new tools all the time is a big part of what makes web development harder.” -Mads Kristensen

“I’m not a pretty pixels person, I’m a code and algorithms person.” -AJ O’Neill

“I’m not hearing hype about people using HTTP2 to get those benefits, I’m only hearing hype around tools that Static built.” -AJ O’Neill

PICKS:

Death Note Anime Show

JS Remote Conference

The Alloy of Law Book by Brandon Sanderson

Zig Zigler Books on Audible

Mr. Robot TV Show

RESOURCES & CONTACT INFO:

Mads on Twitter

Mads’ Website

This episode is sponsored by

comments powered by Disqus

TRANSCRIPT

Charles:        Hey everybody and welcome to the JavaScript Jabber show, this week on our panel we have AJ O’Neal.

AJ:                Yow, yow, yow, coming at you live with the only sane person left in the JavaScript community on our show today, Mads Kristensen.

Charles:        I’m Charles Max Wood from Devchat.tv. Mads, do you wanna introduce yourself really quickly?

Mads:           I’m a program manager on the Visual Studio web team responsible for the web tooling that the old Visual Studio users love and enjoy every day, hopefully but it’s sort of a broad thing. I see the way web development has gone over the last decade. It seems like that’s the only area of development that’s gotten harder. If you wanna build an app for a phone or IOT or anything else, that’s getting easier and easier but it seems like web development is getting harder for some reasons.

                    I see myself as someone that wants to make the complex things easier and the easier things automated. That’s a toll order but I think we’re finally getting to a point where there’s a light somewhere at the end of this and we can break the trend and make web development easier again. We’re not there yet but I think we know sort of what’s required.

Charles:        I think that’s a really interesting point that you’re making as far as web development getting harder. I remember we did an episode on JavaScript tools fatigue which was a big thing that people are talking about a few months ago. We have all of these frameworks coming out. They’re all trying to solve specific problem that we have and make it easier to build more complicated applications. But at the same time, I definitely see where there’s much to know and it seems like there’s something new coming out all the time.

                    One other conversation that I had that I also want to sort of point the listener to is on Adventures in Angular in particular. We had a conversation where somebody wrote in and said something to the effect of, I run the Angular CLI tools to create a new project and it creates all these tools and adds all these things and I checked the directory and it has like 200,000 files in it. We discussed it because a lot of it was like a Node Modules and things like that but there was so much that it just kinda did for you.

                    I don’t completely understand what I’m doing here. I can write my Angular and I come out with an app that works but there are a lot of other moving pieces and I don’t know which of these I necessarily need to understand. It’s like, “Okay, yeah. Well, so do I need to build tool? Do I need to build system? Do I need continuous integration? Do I need jQuery in it anymore or not and do I need to pick any of these other tools and should I be using something like typescript or copy script or name your script or whatever? I totally hear what you’re saying.

Mads:           Yeah, I think the tool chain and the massive sort of introduction of new tools all the time is a big part of what makes web development harder or at least it contributes a lot to it I think. As an example, I think two years ago Grunt was like the thing to use and then last year, I think it was gulp took over there. There were more downloads all of a sudden of Gulp over Grunt. The year 2015, that was sort of the year of Gulp. Now, it seems WebPack is sort of taking over and it’s gaining on Gulp. Maybe this 2016 is the year of WebPack. Now there’s RollUp. Amber is still using Broccoli.

                    There are all these testers or butlers and they do sort of similar things. It seems like no matter what you choose, you’re either wrong, it’s not the best tool for the job or it’s obsolete by the time you’re done with your app. That just demotivates a lot of people, the whole fatigue people have been talking about.

I don’t know if that’s the right word to describe this, I would say it’s more like a fear of doing the wrong thing, a fear of not knowing what you think you’re supposed to know as a front-end developer. You always feel like you’re not good enough. I think that’s what all these tools and all these hype and this rapid introduction of new framework and tools they do to people. I don’t think it’s helpful and I don’t think it’s necessary. It’s not like we’re building apps today using the latest tool, the latest Amber or the latest Angular can do those same apps we could build like five years ago without Angular or those tools.

AJ:                Also, five years ago, there’s only really one framework, it was just jQuery and that’s not even a framework, it’s an API wrapper to make it more JavaScript. You take something that’s less JavaScript, the DOM, you make it more JavaScript that uses actual JavaScript arrays and get transforms things that’s easier to work with.

                    Back then, if you were using one of these tools, it was more likely to just work in more places. Whereas now, it seems like it’s less likely to just work and you have additional build tools to then recompile to make it so that it will work in let’s say Android.

Mads:           That’s why the whole consent of a front-end engineer came in. Five years ago, there wasn’t no front-end engineer, there was a front-end developer. They probably also did sort of the presentation there, server-side code, five, ten years ago. But now, all of a sudden there was a front-end engineer because it’s now an engineering job to know how to do routing and all these sort of stuff that we do on the client now as well as maintaining usually the big NodeJS tool chain that we’ve got. There’s more to the job now basically.

                    The question is, for what? What did it actually give us? If we write a line of business app, in the enterprise for instance, let’s say an expense report app. People probably will use something like Angular today. The question is is that expense report app gonna be better than if it was written without it? I don’t know. I have a feeling that the end result might be exactly the same for the user’s point of view.

Charles:        From the user’s point of view I think that’s fair. One thing that I’ve seen, and I’ll admit that I’m a big fan of Angular, one of my other podcast is about Angular. One of the things that I’ve seen is that the developer’s experience, in my opinion, with Angular is much better. It’s kind of the argument that I’ve put out there for frameworks in general, yes, you could build that in just JavaScript. But, Angular gives you framework and you know, Amber, React. React has some frameworks on how will it do the same thing. But essentially, they tell you where the code needs to live and give you ways of thinking about the problems so that you could frame them easily and not make as many decisions as you would have to make.

                    Now that means also that the framework is not the right answer for everything because its opinions may not fit certain problem sets. But the flip side of it is is that I don’t have to decide on a whole a bunch of things and I get a whole bunch of common tools that other developers are using and I can move ahead and I can solve those problems in a well-defined way.

Mads:           I agree with you. I think that’s also the big allure of those big frameworks is that they do give you sort of a prescriptive way of doing things and you can concentrate more on building the application instead of sort of the plate around it.

AJ:                If we look back in jQuery, the problem that jQuery actually solved was making the DOM function in the way that JavaScript functions. When I see things like React and Angular, if you ignore all the framework parts, the problem that they’re actually trying to solve to me seems to be a very important problem which is giving scope to HTML so that you can have a class that has a defined scope with variables and parameters that exist only in that scope.

                    I think the problem that we’re trying to solve with those is a real problem but the problems we end up solving in addition to those are more imaginary ones. You could solve them in other ways just as well but the scope in HTML, that is a real problem that developers really need a solution for.

Mads:           I think there’s a lot of benefits of using the right application for the right application, be it Angular, Amber or whatever it might be. There’s also a cost associated with it. The cost could be, let’s say in terms of Angular, just as an example, the cost could be that you have to use typescript.

AJ:                You do with Intel that get docs for JavaScripts.

Mads:           Anyway, that’s sort of the happy path. You use typescript and then there’s this tool chain based on Node.js and NPM, I think it’s WebPack. You were opting into like a tool chain. If we go back to the jQuery, example, you just put jQuery JS in your project and that is it, done. There is no build tools needed there, there is nothing needed here.

Charles:        If you needed extra functionality on top of that, then you would just.

Mads:           Get a plug in.

Charles:        Yeah, users pull that plug in it.

Mads:           We’re going in a way where it used to be simple, it used to be very simple but sort of limited maybe. It didn’t do the scoping, it didn’t do sort of the prescriptive application model of what Angular does. But the cost is too high for a lot of people. Why do they wanna put tools in their project?

AJ:                Are we talking cognitive cost, because you say costs. Define that a little better.

Mads:           Maybe a cognitive cost. That would be a good way to say it. It’s a new thing you have to learn. If you’re new to WebPack, if you’re new to Node.js, you need to install a lot of things, you need to understand what’s going on. You need basic understanding of Node.js but probably not that much actually if you go in with like the same WebPack. But then you need to know what other plugins that you need, the different loaders that is required and then you have to accept that you’re putting potentially hundreds of megabytes into your project, into the Node_modules folder.

AJ:                That’s a real cost too because drives are getting expensive. As developers, we can’t afford to pay that thousand dollars to get reasonably sized solid state. But they’re what computers are selling with when you go to the store. Those gigabytes add up pretty quickly in the development folder.

Mads:           Also, just for people, a lot of developers, they wanna keep things night and neat. If they think that here’s a node_modules, I wanna call it something else. Well, first of all you can’t, it has to have that name. I don’t use underscores in my naming conventions so that annoys me. Also, 200,000 files are over there. That bothers me too. I’m not gonna check it into source control but I need to learn I should do that. There’s just so many things to understand.

AJ:                If you work with other people, if you are not the sole, one person developer and you work with other people and somebody checks in those folders, the Bower folder, the Node modules folder.

Mads:           It will happen, I’m sure.

AJ:                It does, it does. I am not a pretty Pixels person, I am a code in algorithm’s person and so I am always working with someone else even in my current situation. I’m the only coder in the company I’m co-founding but my partner, he does Pixels. He will do CSS and HTML and he will check that crap in and then it’s like I got a way. Sometimes I went to visit family, they have a nice house that’s secluded and they have satellite internet and I went over their bandwidth limits, Git cloning dependency stuff. You don’t think about this because you think, “Oh, well, everybody lives in San Francisco. Everyone must live there.” But some people don’t.

Mads:           Most people don’t. Who drives the conversations there? Bloggers and mediums that come, that gets link shared to Hacker News. It’s a certain type of people that sort of drive the conversation and on Twitter and so on.

Charles:        Yeah, but I’m gonna be one of those types of people real quick and interrupt you because we’re talking about things like the Node_modules folder. I never look at it unless I have a problem anyway and I don’t check it in. That doesn’t cause me issues. To some degree, if you follow a couple of good rules, it may not bother you.

Mads:           I personally agree with you. I don’t mind the Node modules folder, I don’t. I don’t look at it. I actually hide it so I don’t actually see it unless I click in Windows Explorer. But I don’t see it Visual Studio. I personally agree with you.

                    When I build web tools in Visual Studio or outside Visual Studio for that matter, I don’t do it just for myself. You quickly learn when you have like a product that’s used by millions of people, that people have different ways of looking at different things. You also very quickly then realize that Node modules is one of those things that a lot of people have big issues with.

Charles:        This is true. I have heard this.

AJ:                Back up just a second, what was your title at Microsoft again?

Mads:           Program Manager.

AJ:                Program Manager of?

Mads:           Of the Visual Studio web team.

AJ:                Visual Studio web team.

Mads:           That’s just sort of the reality is that we have this conversation that goes on online, on media and all that. People sit there, maybe they’re using some older technology because their company keeps them in charge of that and there’s nothing new for them to do. But that, keeping an older app alive for instance. They’re looking at all of this conversation that’s going on Hacker News or what not. They’re feeling left behind, they don’t feel good because they are not using WebPack. They just learned about it yesterday but now they feel like if they don’t use it, they’re gonna be left behind.

                    They haven’t heard about Rollup yet which may or may not deprecate, I don’t know. No one knows this but it could be and then they’re gonna feel left behind if they went to WebPack. There’s a lot of hurdles that they have to go through and there’s a lot of cognitive issues there.

AJ:                What are the type of customers that you are most concerned with in from your perspective because you’re talking about you are making decisions that are going to affect lots of people. I’m imagining a lot of these people are on Windows, maybe all of them?

Mads:           For Visuals Studio, they all are, but we’re also doing tools for Visual Studio Code. They’re not necessarily all but there are two separate types of unused cases.

AJ:                Kinda describe the user story of what you see as your average user. Are they a college student? Are they a junior engineer? Are they senior engineer?

Mads:           First of all, there is no average user. I think that’s very important to understand. We’re all different and we all see the world a little bit differently. There are some categories though, I would say. There is the beginner, there’s the student, there’s the enterprise developer that is sort of forced to not be on the latest, they have to use an older version of Visual Studio for instance or they have to support all the versions of browsers for their internet apps or what not.

                    You have the hackers, you have the console sublime techs and console, that kind of people. You have the Node.js camp. People are just all over the map. It’s not like you’re just a Node.js person. You’re also maybe a Python person as well or if you do http.net, you might have a side project in Rails or you know, JS.

                    There’s not like one persona. That is the average user. It’s really everywhere. What’s really important is that if you are a beginner, if you are brand new and you come in to web development, it has to be a sort of a welcoming simple to get started experience. If we go and say, “I wanna build an app.” And you go search online, “Oh, I’m new to web development, what should I do?” The first thing you’re faced with is oh, Angular 2.0 or Aurelia and you’re just, “Okay, how do I do that?” It’s on Node and then go in do it like what you know in it or whatever and download this, clone this thing from GitHub. Okay, let’s all get it first and then you install your Aurelia skeleton app that comes with Comet, test rehearse and 118MB I think of stuff in your Node modules. If we keep this as a beginner,  they’re not gonna know what to do here. This is just way beyond what they can do.

AJ:                As a Mac user, what you’re describing, the words you’re using sound daunting. But when I think of my experience, I go on the side, I double click and it works.

Mads:           You’re a beginner?

AJ:                No.

Mads:           Imagine you come out of high school or college or whatever and you haven’t really written anything. Maybe you are not even trained in any computer science degree or anything like that, it’s just a hobby or whatever. I wanna make sure that the tools we’ve built serves the beginner that’s a hobby person that just wants to play around us and see what they can do, build a website for their local soccer club or whatever. I wanna make sure that it works for them and I wanna make sure that they can grow in the tooling all the way up to be the most professional front-end developer in the world, basically.

                    Take them on that whole journey. But anywhere you are, on that spectrum of like absolute beginner to absolute professional, it has to be something that works for you no matter where you fit in there. That’s a huge challenge because Visual Studio is a very rich tool. It has a lot of different features. The more prolific you get, the better you become at front-end development, the more control you want of your tools. How do you then tool something that works for both the beginner and the super advanced user but give them the freedom to choose individual pieces that they want on their system. That’s very, very challenging.

Charles:        One other thing that I’ll just pile on with this is that if we simplify things down to the point where the beginners can kind of just get in then get it, then you have a tool that’s simple enough for everybody else too. That kind of simplicity when we’re talking about the JavaScript tools fatigue or some of the other things that we’ve talked about. Having a simple tool that just does its thing is actually pretty nice for the professionals as well. If there are options that you wanna add in and say, “Look, you can tweak it like this.” Then great.

                    I’m not gonna care about CSS right now. I’m just gonna use the compiler tool for that, it just works, then great and then I can go and I can fiddle with Grunt or Gulp or WebPack to my heart’s content till I have what I want out of that.

AJ:                Years ago, we did a show on accessibility and you just said something that was like very similar with what he said. If you make an app or in this case, a tool accessible to one group of people, you tend to make it accessible to all groups of people. If you make an app that works better for people that are color blind, it will also generally work better for people who aren’t color blind. If we make tools that are simpler for beginners, in theory, it’ll also be simpler for experts.

Charles:        I guess my question is seeing that we have people on all these different ends of the spectrum, we have people at the beginner stage, we have people who are figuring out how to build JavaScript into web assembly and do all this wild, crazy stuff and they’ve got all these interesting tooling and other things going on. How do we create a JavaScript environment then that is approachable by everybody and that doesn’t have some of these issues where there’s a new tool of the day next week?

Mads:           I wish I knew the answer to that. I think there are different aspects that we can do. I think Aurelia actually, the Aurelia framework, did a really interesting thing. Just like Angular 2.0, they have the happy path which is sort of this typescript and WebPack tool chain, Node.js and all sort of stuff.

Charles:        Yeah, we’ve had Rob on the show before.

Mads:           Or, as a new thing that there was, here’s Aurelia.js. Just include on your page and start coding up Aurelia. There’s no tools needed here, it’s sort of plug and play. You can get started with Aurelia really quick. I get to know it and learn about it. My app is not growing or whatever. I now wanna draw my tool chain 2 to do the proper tree shaking and what not. You can do that afterwards. The Aurelia module and all the stuff that you build are the same. I think that’s a really interesting approach.

Charles:        That’s like the jQuery thing that we talked about earlier. You dropped it into the page and then you build your stuff.

Mads:           Yeah, I really like that. I think a lot of the tools that we use, and primarily from the Node.js tool chain like whether the Gulp or WebPack loaders or whatever, gulp test I mean. Stuff like optimizing images is something that I think about. People put that in their project as a depth dependency but how often do you actually have to optimize images? It is really important that you do it. But how often do you get new images? Do you do it every time you do the CI built? Why spend time on that? Why not just do it when the images come in or every now and again?

Charles:        You just have a tool or something on there?

Mads:           Yeah, you could do it either as I would say install it as a global module, just do it on your Dev box. Why put that in your project? I’m fine with people that does that. But you can just not do it and do other tools. There are Visual Studio extensions for instance. Now we’re talking about Visual Studio. That can do that too. You basically just hit a keyboard struck at a right click on your project or the individual images, let’s say optimize image, choose between lossless and lossy and you’re good to go. With the latest Souffle and encoding and all of that stuff. That’s great.

                    We tend to just shove everything into the project as depth dependencies. I think the only thing that really belongs there are compilers. Whether it be babel less SAAS typescript, that’s great. You wanna keep that version to your project so that every developer has the same, that makes absolutely perfect sense. I think a lot of the other tools that we use, there are better approaches. That just simplifies things as well because you may not use the Node.js tools but you’re searching online for, “Hey, how do I optimize images?” You go to, “Oh, NPM. Install it to your project.” You think, “Okay, now I need to have that.” But maybe you don’t, maybe there is a different way to get the same result in a much simpler way.

AJ:                I’ve got a question about it. Obviously, the community is just nuts about build tools. One of the technologies that’s come out in the past few years which I think all major browsers including Edge, if I’m not mistaken with optimization HTTP2, which totally obviates the need in terms of what the specs has. For most of these tool, we don’t need to have one spreadsheet with a million images on it, we don’t need to have all of our modules minified into just one single JS file, if I understand. I’m not hearing hype about people using HTTP2 to get those benefits. I’m only hearing hype around tools that Static built.

Mads:           What I learned about this is that it’s not the magic bullet that we think it is. If your JavaScript file is 100k, that’s still 100k over the wire. You still want to minify it, you may wanna split it up so you don’t load it unnecessarily before you need it. It’s no magic bullet. The test that I’ve seen being done has not been like, “Oh, you get twice the speed,” or like not at all, like not even close. I think it’s like there are scenarios where that’s true but as far as I know, and I could be totally wrong, it is not really gonna change the fact that we need the bundlers.

AJ:                I see that in the GoLine line community, there seems to be more support for HTTP2 and the Node community, there seems to be like zero interest in it. I was just under the impression that we’re gonna be able to serve up an index.HTML, there’s gonna be some module that kind of read and cached what the dependencies were and then they will just all get sent out, bundled and minified kind of automatically. Not necessarily minified in the sense of whitespace replace but minified in the sense that it goes through the GZip module and that kind of caching stuff which is gonna be able to live in the transport layer.

Mads:           I will admit, I don’t know enough about it. But, from what I’ve seen, there’s probably a reason we don’t hear more.

AJ:                Earlier, you were saying tomorrow you’re doing a presentation about not using so much of the dependency installers. You can spoil a little because this won’t go out right away.

Mads:           Yeah, that’s fine. It’s a package management issue that I think we’ve gotten, if you look at the page managers that are out there, it doesn’t matter which one, NPM, Bower, the .net world we have new git. Let’s take the front-end one,  you have Bower and NPM. They have a couple of problems that are very similar to what we’re talking about.

                    If I install let’s say jQuery, let’s just take that as an example. I install jQuery using NPM, it gets put into my Node modules folder and I get, I don’t know, 150 files. I just want jQuery min.js. I don’t care about anything else, I don’t even want the .net file because you know what? I’m not even gonna debug jQuery. I just want jQuery min.js.

Charles:        You sound like me because that’s exactly it. It’s like, I just want the thing that I can put in my page. I’m not gonna debug jQuery, I’m gonna go wind somebody else and make them do it.

Mads:           You end up with something in Node module. As you know, on your web server probably, you’re not gonna publish that. Now you needed some tool that will move it from your Node modules folder into your lib folder or somewhere on your web server, on your public path. You can do that in NPM scripts. You don’t need anything else. The more you have of those, the weirder your package JSON and file becomes.

Charles:        If anything changes then you have to maintain the script as well as everything else.

Mads:           Yeah, so there’s no magic bullet to this project. You’re creating a lot of problems for yourself. Take Bower for instance, that’s a little bit better because we can actually place the Bower components folder anywhere we want. In the case of jQuery, we actually get the exact same payload. Get 150 files. But now at least we can put them under disc/lib if that’s where you wanna put them, they can go there. But I don’t need a tool to move things. But now, I will then publish all the 150 files now because they’re in that folder. That’s not really that clever either. I just wanted that jQuery min.js. I didn’t care about the rest. They’re solving a problem but they’re creating other ones.

                    I got this idea, there are these CDNs out there, open source CDNs like cdnjs.com and jsdeliver.com. They’re open source and they have Nodes over the world. They all have almost I think 2,000 JavaScript libraries and CSS libraries and even stuff we were called depth dependencies like test frameworks. They are all on there, on those CDNs.

                    Wouldn’t it be cool then if we could just use the CDNs, I’m doing air coaching as our package manager. I’m not talking about going there, figuring out what the path is on the CDN, downloading the file. But what if we have a tool that looks sort of a similar to, have you ever install NPM package. Let’s just pretend that I have a console, CLI tool called CDN like I do CDN install jQuery.

AJ:                And then it just opens up the next HTML and throws it in?

Mads:           Whatever path I’m in, it just puts jQuery min.js. It’s smart enough so it knows it’s jQuery min.js. I work in Visual Studio so I’m like, okay, we can definitely do command line tool but I also want the visual thing. You have these button you can click, you can right click any folder in your project at client side package or clients that have library or whatever you call it. It pops up a dialog, you can search real time. You say jQuery, it will show you exactly what files a CDN has, you can see it has the slim.js, it has the min, it has the map, blah, blah, blah. No, I just want jQuery min js. That’s actually checked by default because we know, actually the CDN JS and jsDelivr knows the default file is. We can just pre check that. If that’s all you want, just hit enter and you’re good.

                    You can hit all the versions all the way to whatever versions they have which is Elm. They are available on the CDN. That way, we have that ultimate flexibilities and we only get what we need and we can put it to in any folder that we want like maximum flexibility. We can also create a manifest file. CDN.jason is called that and we have our dependencies and then we can just list them and they’re basically just CDN.js dependencies. That means we can now restore packages, you don’t have to check them into source control. We can do sort of the same stuff.

                    The only thing we can’t do with this is dependency resolution. There is no information about dependencies. The question is is that okay or is it not okay? Definitely in the case of jQuery, that’s perfectly okay. Or bootstraps. Bootstraps, okay, it depends on jQuery if you choose to use the JavaScript side of bootstrap. Maybe you know that and you install jQuery.

                    The question is is that okay? Is that okay that there is no dependency resolution? If you look at Bower and NPM today, the dependency resolution on each of them, there’s no magic bullet there. They have issues and we talked about this a little bit earlier. If you end up with deeply nested Node modules and NPM, if you have some version mismatch between dependencies, there are dependencies.

Charles:        That’s always fun too.

AJ:                For those of you that are still running Node .10 or something, you definitely need to upgrade. But in the new one, they did get rid of a lot of the Node modules garbage where for the most part now it’s all flat directory structure in your main project directory. That’s a huge win that I don’t think a lot of people know about yet. It’s amazing. People run old versions of Node. People are still running three, four year old versions of Node.

Mads:           You need NPM3 for that. That’s the one that does the flat hierarchy. What is that 3-10 version, something like that?

Charles:        I don’t remember.

Mads:           Anyway, that helps a lot. Bower has other issues where that’s how has been affected hierarchy and so you get warnings and you get like, “Do you wanna do dash, dash force.” Or whatever it’s called to force and they were dependency or whatever. That doesn’t really work either. It gives you warnings about things and it tells you and it brings in stuff but it doesn’t resolve when there are conflicts. This remains to be seen. We’re testing it right now, we have like a couple of thousand users on this prototype. So far, that has been not a single report a bit of dependencies or like missing support for dependency resolutions.

                    It might be fun. But the fact that it’s incredibly fast. There are Nodes all over the world for these CDNs. It’s instant. It works completely offline too. If you ever had a package, a package in this case that’s the jQuery. If you ever installed that on a machine before, it’ll be on a cache somewhere in your user folder. Offline, it just works. You can even go so far to say well if I have used jQuery before, in the background, let me just see if there’s a new version coming online on the CDNs. Let’s just bring it down. They’re so small anyway, it’s not like 150 file GitHub repo that I’m cloning. This is just a couple of files.

                    You can imagine that we can build some heuristics that will automatically download the latest inquiries based on your pattern or also maybe based on one of the most popular things out there. Predict what they might wanna do.

AJ:                Also, if you download jQuery, then the package manager that you’re talking about on this Visual Studio plug in that you’re working on would say, oh, well people that use jQuery really, really commonly use Lightbox and some jQuery plugins. Just go ahead and download that couple of kilobytes or you why you’re on a Wi-Fi connection and then when you’re on the plane and you’re, “Oh, I need that thing, I forgot.” It’s already there.

Mads:           We can do way more. I forgot the name of this project, maybe you know other projects out there that has basically a JSON file that lists dependent security vulnerabilities in known versions of libraries. For instance, jQuery 164 has a known security vulnerability. This JSON file, GitHub describes all these things. You’re using this version of jQuery, maybe you wanna consider it, click here, update to the next version of it.

                    We know this is a library file, this is jQuery, We can change the icon so it has a different color. A deeper tooling integration that makes working with dependencies much clearer, basically. I think from a tooling point of view, this is not a Visual Studio specific thing. When we built this which I really, really hope we do like right now, it’s just approved concept, this is not what we’re gonna take forward, we’re gonna start fresh with what we’ve learned from the approved concept. When we do that, we’re gonna make it across platforms so it’s gonna run on .net core. You can imagine there’ll be extensions for it. There might even be NPM module for it as well. You can choose the console, you can have tooling integration to VS code or Intellij, whatever that you want. That’s the point. I think it solves a lot of problems for a lot of people if we do it right.

AJ:                Yeah, what you’re describing sounds good to me.

Mads:           I just like the fact that it’s not a package manager. It’s not, “Microsoft is building a new package manager.” No. It’s sort of just a download client. That’s smart. That’s all it.

Charles:        If people want to try and do something like this on their own while you’re still experimenting, is there a good way to do that? Is there some description of okay, do this and this and this and then you’re there.

Mads:           No, no. It’s just approved concept so there is not really anything except the extension and the source code is on GitHub and you can go take a look at it. Another very beneficial thing, let’s say your company has some JavaScript plugin, whatever, jQuery plugins that you’re sort of mandated to use or whatever. They probably have them on a share or somewhere. If you use Bower, you have to set up sort of a Bower registering locally or NPM registry that’s local to your company, that’s a lot of work.

                    With this CDN approach where we have that manifest file, the manifest can point to either CDN path but it can also just point to any path. You can just point it to my company is jQuery plug in that’s on UNC share or somewhere like a central server or somewhere on the company and it will just take it in. You have that full flexibility, you don’t have to set up like a custom registry or anything like it. It’s really, really flexible.

AJ:                What’s a UNC share? I’m not familiar with that term.

Mads:           Maybe it’s a Window’s term. It’s basically like a share, shared folder on a company server.

AJ:                Oh like the Z drive?

Mads:           Yeah, exactly.

AJ:                Okay.

Mads:           That flexibility I think is what a lot of people have been asking for with the NPM and Bower and wasn’t ever able to get it. The fact that you just say, “I want jQuery min.js into that specific folder and nothing else.”

AJ:                I really do wish that you had to specify dash, dash, dev, dash, dash, trash my drive in order to get all the dev and the test. I don’t care. I’ll let the person that’s building the library test it. If I wanna become the developer to that library then I’ll go on that GitHub readme and I’ll copy and paste the thing that’s dash, dash, install all the freaking dependencies.

Mads:           I would say this could be solved by NPM and Bower to certain degree. NPM, not so much because during your log in to the Node_module folder’s name, you can’t change that. They both have the concept of from main property which is an array of files that are in the packaging, okay, these are my main file.

                    In terms of jQuery, I think that jQuery main point to jQuery.js which is not the file I wanna use. I wanna use jQuery.min.js. If you go look at the packages, the different packages, it’s very rare you see one that actually is accurate to what you want. If NPM by default, when you said like NPM install or Bower, Bower install would look at the main file and only give you that, then it would actually go a long way to what I’m describing.

AJ:                I think this could be done automatically as part of the published process but you also have to inspect the requires and build the required tree. Sometimes, people to be crafty, for specific reasons of not loading a large module until it’s needed or something like that, I don’t know how many do that but I do that. The requires aren’t necessarily all listed up on the top. I guess that’s what ES 6 is trying to solve so it’s easier to analyze where dependencies are.

Mads:           But either way, there is a solution somewhere in there for that problem too without you having to get the benchmark folder and the docs folder, test folder.

AJ:                Even if at most people, they have main and they have lib and that’s it, from what I see and there is a place to specify the lib folder in the NPM package on JSON.

Mads:        Maybe they have solved it. The package owners, if they were more aware of this and we’ll have them more clean package basically then the problem wouldn’t be as big.

AJ:           Also, we’re not really defined to the Node modules folder. It’s required as just a JavaScript function like everything else in Node. People do overwrite it, we’re talking to somebody yesterday that they do dependency injection. They overwrite the default require with another function and export that and then they’re able to do better testing by doing the same kind of dependency injection that Angular does with the require function. We could fix it. I think that there’s just not enough community desire to fix it.

Charles:        I think that was Donovan Brown, we talked to him about dev ops. I really wanted to get into web development in Visual Studio but I don’t think we have time. What we may do is just get in touch with you and have you come back on the show.

Mads:           Yeah, sure. Anytime.

Charles:        One thing that we do at the end of the show, I’m gonna start wrapping us up so that we can be out at here before the next group, is we do picks and what picks are is just anything that you’re kind of interested in or into right now. I have people picked TV shows or music or books or tech. it can be techs or if there’s a library you’re working on or something you wanna talk about or anything like that. I’m gonna make AJ go first so you can kinda see how this is done.

AJ:                I love nerdy people. When I discover them, I’ll ask them nerdy questions like, “Do you watch anime?” And then sometimes, like every time, they’re like, “Yeah.” And then I’m like, “Sweet because I’m a closet anime watcher.” You wouldn’t necessarily know by the way that I am. Maybe you would.

Charles:        Yeah, your giant physique.

AJ:                My extremely long legs. My blue hair. There is one that I just discovered the other day because I was talking to somebody, she mentioned it called Death Note. I started watching it last night and it’s really cool. Japanese culture, there’s a lot of these shows like the Miyazaki films like Gods and spirits are like a real big influence in the way that shows go.

                    There is this God of death that drops its death notebook that when the God of death writes a name in the death notebook, that person dies. The God drops the death notebook and this student picks it up and then it transforms his life. You find out in the first episode it becomes a power trip on him. He starts out as if he’s gonna be the good guy but then by the end of first episode, you realize how he’s gonna be the bad guy.

Charles:        Interesting. Alright, I’ve got a couple of picks that I’m gonna throw out here. The first one is that as we record this, I’m starting to gear up for JS Remote Conf in January. It’s an online conference, you don’t have to travel. Usually, I have people like AJ and just other people we’ve had on the shows come on and speak. If you’re interested in speaking, the call for proposals is open. If you’re interested in attending, you can buy tickets. Early bird tickets are available until about a month before the conference. I recommend you get them then.

                    One of the thing that I will also throw out there is that the videos from the other conferences are also available on Devchat.tv so if you go to devchat.tv/conferences, then you can see which conferences are available. Once the conference videos are about a year old, I move them over so you just have to enter your email address to get them. Before then, you actually have to buy basically it’s an after the fact ticket and then you get unlimited access to videos. Definitely check those out.

                    I’ve also been reading a book, It’s called the Alloy of Law by Brandon Sanderson. It is kind of a fun book. It’s set in the Mistborn Universe. It’s just like 300 years later. I kinda wanna say it’s Western with magic but it’s a little more complicated than that. It’s set early 1900s. They’re actually in a city, it’s not really Western. The main characters were peacekeepers out in the remote areas and then one of them came back and then the other one came back. It’s a really fun series. I really like most of the stuff that I’ve read by Brandon Sanderson. I’m gonna pick those.

                    I think I mentioned this on the show before. But I’ve also been listening to a lot of Zig Ziglar. He’s a motivational speaker. He covers a wide gamut of topics but one of the things that I have decided I’m gonna do is by the end of the year, I’m gonna listen to everything that Audible has by Zig Ziglar. A lot of them are like one hour talks. There are handful of books in there. I am just really enjoying it. I feel like it’s inspiring me to do better, be a better person, teaching me how to live better. I’m just really liking that. If you’re looking for inspirational, motivational and very practical stuff about how to live better, I can’t recommend highly enough that you listen to Zig Ziglar.

Mads, you have some pick for us?

Mads:           Yeah. I have something that’s new to me, maybe not new to all the listeners. The TV show Mr. Robot. I downloaded it for the flight down here. I’ve been binge watching it here at the conference whenever I had some down time. That’s just great. I don’t know if you have seen it. I think it’s the first TV show, movie, whatever that is, actually depicting accurately how hackers work. When they show console and then you know type the password, the password doesn’t show. Just like it is in real life when you have it too. They just get it right. It’s really, really well done. It’s a pretty paranoid show though. I’m not sure it’s for everyone but if you’re into good tech TV shows, then Mr. Robot definitely. Season 2 is out now.

AJ:                Is this Netflix or Hulu or what?

Mads:           I don’t know. I don’t know if they have it on Netflix. But I downloaded it from H-Box movies  or whatever it’s called so I can watch it offline. That’s really, really good. Christian Slater, I haven’t seen him in years. He’s in it.

Charles:        It’s funny you mentioned that that it’s like realistic for tech people because when we were driving over here, our Uber driver worked at CDC and so we asked him more like, is it anything like what we see on TV, he’s like, “No.” And then he’s like, “I always wonder about the tech stuff.” We did the same thing. What they do in the movies is not possible.

AJ:                If only you have three hands, you could hack the variable faster.

Charles:        Yup, exactly.

Mads:           I’m gonna write GUI in the Visual basic to look up the IP address.

AJ:                You are also watching CIS?

Mads:           I just watched the YouTube clip, I think.

Charles:        Security expert in NS to use the password. Password? Thanks for coming and talking to us. This was really fun.

Mads:           My pleasure.

Charles:        We’ll definitely have to do it again. If people wanna follow you on Twitter or see what else you’re working on, if you have a blog, anything like that you wanna share?

Mads:           Yeah, Twitter @mkristensen. My blog is madskristensen.net.

Charles:        Alright, we’ll go ahead and wrap this one up. Thanks again. We’ll catch everyone next week.

x