The Speed of JavaScript Implementations - Lately in JavaScript podcast episode 22

Recommend this page to a friend!
  Blog JS Classes blog   RSS 1.0 feed RSS 2.0 feed   Blog The Speed of JavaScri...   Post a comment Post a comment   See comments See comments (0)   Trackbacks (0)  


Categories: Lately in JavaScript podcast, JavaScript performance, JavaScript APIs

Recently, Google released the project Octane that aims to measure the performance of different JavaScript implementations using benchmark scripts that call real world JavaScript libraries.

That was one of the main topics covered by Manuel Lemos and Michael Kimsal on the episode 22 of the Lately in JavaScript podcast.

They also talked about implementing your own version of Yahoo! Pipes using JSPlumb library, the new PHP VM to execute PHP code using JavaScript, displaying large videos on page backgrounds with BigVideo.js, a comparison between different JavaScript Physics engines, and using Cross-Domain AJAX versus JSONP.

Listen now to the podcast, or watch the podcast video, or read the podcast transcript to learn more about this an other interesting JavaScript topics.

Loaded Article


Listen or download the podcast, RSS feed

Watch the podcast video

Read the podcast transcript

Click on the Play button to listen now.

Download Size: 34MB Listeners: 1437

Introduction music: Riviera by Ernani Joppert, São Paulo, Brazil

View Podcast in iTunes

RSS 2.0 feed compliant with iTunes:

Watch the podcast video

Note that the timestamps below in the transcript may not match the same positions in the video because they were based on the audio timestamps and the audio was compacted to truncate silence periods.

Show notes


Introduction (00:18)

Connected graphs with JSPlumb (1:52)

PHP.js: PHP VM in JavaScript (5:06)

Benchmark JavaScript Implementations with Google Octane (12:02)

Display large videos on pages background using BigVideo.js (19:12)

JavaScript Physics Engines Comparison (26:22)

Cross-Domain AJAX versus JSONP (31:17)

Latest JavaScript Objects published in the JSClasses site (42:12)

Upcoming issue of the JSMag Magazine (56:35)

Conclusion (1:00:22)

Introduction (00:18)

Manuel Lemos: Hello and welcome to the Lately In JavaScript PodCast. This is episode 22 I think. It's been a while since we started recording this podcast episodes. And as always I have here with me our leader Michael Kimsal. Hello, Michael. How are you doing?

Michael Kimsal: Hello. This is really, really silly. I'll shut it off now, here we go.

Manuel Lemos: Yeah. OK. Well, this is August. We've had at least in my view a slow month. There isn't many topics to talk about as in the previous months. Now,what you think, Michael?

Michael Kimsal: Well, I'm happy and excited. It looks like a party going on here, and the whole neighborhood is invited. There's so much going on in the JavaScript community. I actually, I sort of share your sentiment. I don't think I've slowed down, but it does feel like..

Manuel Lemos:Everybody is..

Michael Kimsal: Some things do slow down. So me, yeah, so probably some vacation and even if people aren't actually going away anywhere, maybe they are a bit more wrapped up with their kids back to school stuff, and things like that.

Manuel Lemos: Yeah. Well, but we still have some interesting topics just to talk about. It's always good that even in a slow month there is always some nice things going on in the JavaScript world.

Connected graphs with JSPlumb (1:52)

Manuel Lemos: And I think we could start by the JSThumb project. Michael you found out about this project. What do you want to highlight about it?

Michael Kimsal: Yes, I did. I am going to see if I can share my screen. Screen share, and where did this go? There you go, I'll just select share selected window. Can you see this up here?

Manuel Lemos: Yeah. It's a little blurred, but we can see it, but good enough.

Michael Kimsal: The core, the name of this is jsPlumb with a b at the end, And this is a way of creating plumbing or pipes between different UI elements and you can move them around, and the piping between them it moves around and sometimes reorganizes itself. This is very reminiscent of probably about six years ago, the Yahoo! Pipes.

Manuel Lemos: Yeah.

Michael Kimsal: And I know when that first came out there were people saying, "Oh can I use that same library? How do I do that?"

And I think there's many couple of other attempts over the year to try to recreate this. This one just came on my radar recently and I just want to at least share it.

The interesting thing about this is that you can, if you see over here, you can use it with either SVG or Canvas, I'm not sure about, I mean, it says VML there two, but there are multiple options here.

Also there's some integration either with jQuery or MooTools, or YUI 3. So probably between those three libraries likely one of those is something that you're using, unless maybe you're a hardcore Ext or Dojo person. That said, it's just a little something that it's kind of neat.

I'm not sure that, years ago I would have had a direct use for this. And when I saw this I thought, "Hmm, there's something I'm building and it certainly doesn't require to use this. But can I?"

I probably won't use it for that particular project just because I'm on a deadline, but who knows, we'll cross that bridge when we come to it. Undo my screen share, there we go. Hello?

Manuel Lemos: Yeah. Well, what I was wondering if this is a generic block composition tool? Because as far as I remember Yahoo! Pipes was to combine sources of information like the RSS Feeds.

Michael Kimsal: This is just the UI component with that. This is not doing any sort of multistage processing or anything like that, or information filtering, cleaning like Yahoo! Pipes was. This is just the visual UI component of things.

Manuel Lemos: Yeah. So I think it probably can be used for more interesting purposes because if it is that flexible and can be generic, I think people will appreciate it and maybe can see some surprising uses for this kind of library.

Michael Kimsal: Yeah.

PHP.js: PHP VM in JavaScript (5:06)

Manuel Lemos: Well. OK. Moving on with our podcast, I would like to continue and talk about a project that is somewhat similar to one that we actually even commented in the past. This one is called PHP.js.

There is also another project called php.js which aims to be... how would I say... a virtual machine for executing PHP code from JavaScript I think. And I was trying to use the screen sharing here. OK. I think you can see it now. Anyway, we'll post the link to this project in the show notes.

But what is the purpose of this is basically to have a PHP engine inside of a JavaScript program and to run in whatever environment you'll be running JavaScript. It could be on the browser or maybe Node.js.

I don't know how far it has gone on the coverage of PHP features, but it says here that they pass 670 tests. I'm not sure if these test are those that come with PHP suite of tests.

Anyway, since this is not exactly new because we already had that php.js project before, I wonder what this brings up as an alternative implementation because it seems to be somewhat for the same purpose or maybe I'm not getting this right.

Michael, what were your impressions about this project?

Michael Kimsal: Well, it's not that I'm trying to figure out what the purpose is. Right from here says the... well, I lost it. Where was it? Reads code and transform JavaScript. I was trying to find the usage here. Make me a new PHP engine, and in that PHP engine you pass on some PHP code and then you say like in this case, engine.vm.OUTPUT_BUFFER as it shows in the screen there.

I would like to have seen maybe a larger use case. To be fair he's got some sample code on here, like here is sample PHP code and you can run this. I'm trying to figure out if there is a good use for this like a good practical use for it.

And there maybe, and it's just escaping me. But somewhat like.. actually it's not maybe not like CoffeeScript, but this idea of people saying, "I'm going to change", "I'm going to have this something that compiles onto something else so that I can write one language in another." CoffeeScript is probably bad example because it's trying to just make JavaScript easier.

Manuel Lemos: Yeah.

Michael Kimsal: And this is more I want to think about stuff in terms of PHP, but have it run in JavaScript. I wish I could see more of a what particular use cases this might be used for. There probably are some, they're not just common to mind.

Manuel Lemos: Yeah. Maybe they just want to use some PHP library for instance with a Node.js environment.

Michael Kimsal: That's the one thing that he says though is to not do. It says, "It probably will run or it can run under node, but don't do it." It can always be run a node.js, but strongly recommended not to do. Do the potential security issues. So I don't know if there's particular security issues more just with node or with all js engines. But if you're running it the browser for example, then it's maybe the implications are less.

To have a warning like that, but maybe not going to the reasons why it was little frustrating.

Manuel Lemos: Yeah. Well, I think the security issues they are bringing is to run arbitrary PHP and not some controlled PHP that you define.

Michael Kimsal: But well..

Manuel Lemos: User provided PHP I think.

Michael Kimsal: Well, that idea of...what you are bringing up before about the idea of saying, "Well, let me use libraries, existing libraries." There probably are some out there that can be used in isolation, but for anything I guess I can't think of anything offhand that would be...

Maybe there's some token like language or like text parsing libraries what not to use, but it just feels like the majority of libraries I can think of are going to assume that they are going to have access to the file system or database, or something, or that they're running in the context of a server as oppose to running in the context of a browser.

Manuel Lemos: Yeah.

Michael Kimsal: I'm probably being overly critical of this, I don't mean to it. I would like to have seen specifically some good practical "oh, yeah, here's this library, now you can use this. Here's what you could do with your browser now specifically."

Manuel Lemos: Yeah.

Michael Kimsal: But technically the idea of its parsing tokenize your PHP creating as it says here, creating, building an AST tree. Technically really awesome and very impressive.

Manuel Lemos: Yeah. Well, the only purpose that I probably see could be a good use maybe to you some PHP library that's for some reason does exist an equivalent for JavaScript.

Well, it's not that really done too much of it. And then be a cool project. Actually a trivial one because it's not everybody that is skilled enough to build a language faster and a virtual machine to execute the converted code in a different language.

Michael Kimsal: Yeah. I guess one of the thing that springs out and I haven't, I didn't see it addressed when we have the other. Now interestingly he has sample code for dealing with the magic methods in PHP like call, and get, and set in again in terms of kind of reusing existing code, there seems to be at least with some of them like some of the major frameworks out there they're making reusable libraries, hey you can use this.

You don't have to use Zend framework code in Zend framework, you can use it in your own packet or your own project for example. They are all going with namespacing now and that was something I didn't see if that codes were to namespaces or not.

Manuel Lemos: Well let's see if this project evolves somehow and gets some adoption.

Michael Kimsal: Yeah. Come back to it in a few months. Put it on the list.

Benchmark JavaScript Implementations with Google Octane (12:02)

Manuel Lemos: Well, but moving on with our podcast. Let's see if I can screen share. OK. I think it's showing up. There is this new project from Google called 'Octane', which is basically to benchmark JavaScript implementations. I suppose that this is meant to evaluate past our JavaScript implementations on different browsers.

Michael Kimsal: Yup.

Manuel Lemos: And well, as you may be seeing on this screen if he ran this benchmark. I think it is testing real libraries, not every kind of library, but some that they have picked and they are evaluating how far it is running. Well, I just tested this is Chrome, but I suppose they probably want to compare it with let's say for instance Firefox and Internet Explorer.

I don't know what was the real purpose of this. JavaScript benchmarks are not new.

Michael Kimsal: Are you... can I share my screen for a moment?

Manuel Lemos: Yeah, sure. Just switch to yourself and talk.

Michael Kimsal: I am switching to myself. I want to share that one, yeah. I want to share. OK. I'm going to share that one first. This is my numbers then I have what? Do I have to do this? I don't know how to get mine in the main window.

Manuel Lemos: I'm seeing yours when you talk, it's automatic.

Michael Kimsal: OK. Because I'm not seeing mine. Now I see your face, but I'm going to turn my head and go back to the. This is my Safari scores and then... that let me do screen share and show my other one. This are my Chrome scores, and you can see these are sometimes three to 10 times faster.

Manuel Lemos: Yeah.

Michael Kimsal: You say why would Google want to do this? Probably because these real world tests make Chrome look much, much better.

Now granted, I'm using... that was Safari 5 on the Snow Leopard I'm not going to 6. So I think there has been a lot of performance and improvements in 6, but whether all this would perform three to 10 times better, I don't know.

Manuel Lemos: Yeah.

Michael Kimsal: Anyway, just want to share that as a comparison on the same machine.

Manuel Lemos: Right.

Michael Kimsal: To see what those numbers look like. And it was interesting to see your numbers in Chrome too.

Manuel Lemos: Yes. Well, it doesn't make sense to compare numbers in different machines.

Michael Kimsal: Well.

Manuel Lemos: Because they are different, the machines, I think.

Michael Kimsal: I do understand that it was still interesting to me because I have an idea of how fast your machine is versus mine.

Manuel Lemos: Yes. In that sense, yes. But I think for the purpose it's just to compare... well, in my opinion it's to compare the JavaScript implementations.

And the purpose to that coming from Google, either they are trying to say, "We are better," or they are trying to say, "Hey, competitors, wise up! You need to improve your implementations because you are lagging somehow. " I don't know. What do you think about that? Could it to be Google teasing the competitors?

Michael Kimsal: It's probably a bit of both. It's now another benchmark tool that they sort of control. I mean, not that they're controlling all the tests, but they can now say, "Hey, this here. Other people can use it."

And one of the flags here is that it's modern as opposed to maybe earlier benchmarks. Yeah. What's the difference here between octane and other things. Well, Octane aims to be representative of an actual workloads. Many make micro benchmarks such as Sunspider were written at the time when JavaScript wasn't used extensively.

Manuel Lemos: Yeah.

Michael Kimsal: My microphone just fell. Gosh, the Pete Higgins I think have run from the Dojo group, Dojo toolkit group had I think he had written benchmarking suite a few years ago that was running through a lot of quasi real world. It wasn't using separate benchmarks like this, but it was doing different things an saying, "If you want to do a Dojo, this is this.

If you want to do the same thing with jQuery this." And it had the same kind of output of a bunch of squares on the screen, but that was probably three years ago. So there's probably some arguments to be made to continually have new benchmark suites that encompass whatever maybe state of the art libraries and functions are doing now in 2012 versus benchmarking loops from 2006.

Manuel Lemos: Right. But well, I suspect that if this is taken... if this gets some attention because since it's yet another Benchmark tool pro it might not get much attention because it's not as up with something new.

But if it may get some attention I guess probably Microsoft will come and say, "Oh, Google picked up a specific benchmark/libraries on which their browser runs faster, we should be able to pick different libraries on which IE does somehow better.

Michael Kimsal: But it would be interesting if they're open enough with this to include other tests that maybe make them look not as good and maybe make IE look better or Opera look better. You know, that would be the hallmark of openness is if they say right here, "Well you can file a bug about something."

Manuel Lemos: Yeah.

Michael Kimsal: If the test code they say if the test code can be packaged in a self contain open source friendlyway, we'll consider it for inclusion in the future. So, maybe.

Manuel Lemos: I was trying to find out here, but usually these things are sort of open, I mean, open source.

Michael Kimsal: Yeah.

Manuel Lemos: You can change things, but in the end it's what is in their site that is being evaluated regardless if all the people evaluate other things. Anyway, I think this is in my opinion this is yet another tease from Google to other browser vendors too so they can catch up on.

Michael Kimsal: Catch up? Hmm.

Manuel Lemos: On doing things faster on their browser so the applications that traditionally look slow because the JavaScript implementation being used on the specific browser they start looking slow if the browser developers do an effort somehow like Google has been doing to make their browser much faster.

Well, that's just an opinion. We do not see a specific comment on their real purpose which gives us just wonder about it.

Display large videos on pages background using BigVideo.js (19:12)

Manuel Lemos: OK. We're going to move on with another topic. This one, well I need to explain something additional, but let me introduce first the topic which is about a big video library.

Michael Kimsal: Oh, OK.

Manuel Lemos: Actually that's what they call it and I don't know if you can see the video that I have.

Michael Kimsal: Yes.

Manuel Lemos: It's probably slower than it's playing back here. It's quite smooth, although this machine is quite fast. I have seen it in different machine, it's much slower. Anyway, just to explain to our listeners. This video library is basically a jQuery plugin that can somehow make videos play on the background of page elements.

I suppose they use the video element of HTML 5. Well, the effect is really impressive and just because it's not usual, but it's pretty much seems like you are watching TV on the background of your page.

And the reason that I wanted to comment about this, not just because it's impressive and probably is going to be a trend, Michael, I don't know if you notice there is a feature on Google+ like it was introduced like some weeks ago about events. You can't create an event on Google+.

Michael Kimsal: Yeah.

Manuel Lemos: But that's nothing special, it's pretty much similar to events that you see on Facebook, but the detail that got my attention is that when you start Google to the Google+ page you create an event.

I was trying to see if I could create, well, let me just describe it and people can check it out later. You can pick a theme for the event and usually it's a large background picture.

And the details is that the picture although it seems to be a steady picture sometimes you'll notice something being animated on the picture like some balloons on the wind, or some candle moving somehow. And it's just a very small detail on the picture.

And what somebody noticed that and asked me, "Wow did Google is doing that? That picture is just being animated in that very small detail." It turns out that they are using MPEG for videos on the background.

And if you have HTML 5 enabled browser, you see that animation as an alternative to a steady picture. For those that still do not have run an HTML 5 enabled browser, they'll see just the steady picture.

And it's quite impressive because it gets your attention if you look at it for awhile. It doesn't start to animate right away. It's not a big deal, it's just an unusual use of HTML video in Web pages. Thanks to HTML 5, as video now became a standard or a page element.

Michael Kimsal: Yeah.

Manuel Lemos: You don't no longer have to use Flash to show videos on page. I don't know if you have notice this feature of the Google+ events. It's not about the event itself, it's just the use of video on the background.

Michael Kimsal: Yeah.

Manuel Lemos: And it gives an impressive effect.

Michael Kimsal: I haven't specifically seen it on the events, but... it wasn't the big video thing, I saw an announcement of that a few days ago. It wasn't specifically that, but I could swear that I've seen background images, video and background images a little bit more.

I've seen it a few times over a couple of months and maybe it was related to the release of this, maybe it's something else.

As we get standard, as more and more people have fast bandwidth as a standard we'll probably see more things like this. And you know, the examples on your screen in that bigvideo.js, their entire move in the background, and there's probably some uses for that, but we may see more of the subtle stuff like Google is doing with their events.

Manuel Lemos: Yeah. I think this may start to become a trend because nowadays people use small animation effects to get the user's attention to make pages look more impressive.

But if it starts using video even if there are small video clips just being animated on the background with well, maybe not taking that much bandwidth because video is compressed and if you just animate very small parts of the screen, it still gives a nice effect and people may start using this as a means to impress the users.

Michael Kimsal: Yeah.

Manuel Lemos: That's my take on that. Well, anyway I'll talked about using video on the background, but didn't talk much about the library itself which as I said it's a jQuery plugin.

I just hope they don't use also audio to annoy the users in the background, although that's not exactly new, in the '90's we already seen people annoying others with a lame background.

Manuel Lemos: Oh, wait. Yours is not playing.

Michael Kimsal: Yeah. Oh, yeah. I just went to your web page and music started playing.

Michael Kimsal: I don't know what happened there.

Manuel Lemos: OK. Well, anyway the idea just not only to show this library, but also maybe get people's attention that's probably going to be a trend on different way to get use as attention. And now I think websites are going to get heavier than usual. Well, anyway...

Michael Kimsal: It's funny how you looked at me when you said heavier than usual. I was not excited.

Manuel Lemos: No. You are always imagining things.

Michael Kimsal: I can't believe you said that. Oh, you're going to make such a big fat deal about that. Yeah. I have, yes. OK.

Manuel Lemos: Well, anyway.

JavaScript Physics Engines Comparison (26:22)

Michael Kimsal: Are we going to look at the physics engine?

Manuel Lemos: Yes. Actually I was trying to figure why I jumped the order.

Michael Kimsal: Oh, want to see. I'll show you my physics engine right there. Yeah. That was it. My physics engine.

Manuel Lemos: Yeah. Well anyway.

Now I'm introducing the next topic. I'm just trying to get back at screen sharing part. OK. Here it goes. This is an article... well, not so much describing all physics engine that exist, but providing a comparison between some of the well known physics engines like box2dweb, Ammo.js, JigLibJS and Cannon.js.

And well to tell you the truth, I actually I only knew box2dweb because we even talked about it before, but the author goes through even some sample content to explain what are the features this physics engine and how they are supposed to be used.

Some are just 2D's, other are 3D. Well, the basic conclusion that comes to is that -although it's nice to have this physics engines which are basically means to animate elements on pages, he just says they are not enough mature at least in his perspective on the matter what is expected of them to be?

Well, I don't know. Since we didn't have physics engine in the past, I think having them now it's great evolution. Physics engines have been used for very successful applications like Angry Birds.

Michael Kimsal: Yeah.

Manuel Lemos: And if that is not impressive enough, I think the author is expecting something much more impressive than we have seen so far.

The author is Chandler Prall and I'd probably show the link to this article for those that are interested to learn more about this physics engine comparison to read them, learn what he's talking about. Michael, I don't know what were your impressions. Do you use physics engine for any purpose on your projects?

Michael Kimsal: Oh, goodness. No. I don't get that advanced and things. It did seem to me, I was just going through this, testing them out, it looks like the box2dweb one at least on my hardware was the best combination of speed and smoothness. A couple of others seemed maybe slightly faster when they were smaller number of elements.

And I just run through each example in my browser and maybe that because I'm running them all in the same page that maybe there's some conflicts as well too. But it seemed the box2D seemed to be the best. Again, given my hardware anyway. I don't know if there's any scientific stuff you could draw from that.

Manuel Lemos: Yeah. Well, I think some physics engine that he mentions are not really comparable because they are meant for performing 3D animations. And 3D and 2D are usually for different purposes.

Michael Kimsal: Sure.

Manuel Lemos: And other than that as we have seen before, even for fast machines, 3D engines, they are cool, but probably demand too much resources to be used in browsers. Although it's always nice to see this evolution. I don't think you can play complex 3D games using these engines.

Michael Kimsal: Yet.

Manuel Lemos: Yeah. Right.

Michael Kimsal: Yeah. There you go.

Manuel Lemos: Maybe in the future that will be common and you probably enter in a page in which you're being walk by a guest in 3 dimensions all animated as if you are being received by a human.

Michael Kimsal: Or of giant paper clip.

Manuel Lemos: [Laughter] That could be, the tool come from Microsoft, right?

Michael Kimsal: Yeah. Hey.

Manuel Lemos: They already had this in the past in 2D. Maybe now they're going to evolve and put it in 3D.

Michael Kimsal: So we can see him rotating around behind.

Manuel Lemos: Dancing and stuff.

Michael Kimsal: Ooh. OK.

Manuel Lemos: OK.

Michael Kimsal: We shouldn't go there.

Manuel Lemos: I think we should not get involved in that area because our R&D is a bit lame. [Laughter] OK, ever mind.

Cross-Domain AJAX versus JSONP (31:17)

Manuel Lemos: OK. Moving on with the podcast, we're going to talk now about an article that showed on the JS Classes site. Actually it was an article about package by Hensel Hartmann from Switzerland. He developed this Cross-Domain AJAX package, and then he wrote this article.

Actually he wrote it right after he published the package and only recently I have approved it because I was writing for implementing a new feature on the site that when you approve an article published by an author it is spread to the social networks using that feature of the site that allows any users to link their js process site to Facebook or Twitter and when a new content like this is published it gets reposted on their timelines in those social networks.

And anyway now that's all implemented, I reviewed and approved this article. And it is basically to show Hensel's view on why it's implemented this cross the main AJAX library which is basically a way to send their a sort of AJAX request is not exactly requested on via the XHR (XMLHTTPRequest).

It's just the way to fetch some JavaScript code on the server to maybe execute some part of a modular application and retrieve the code dynamically from the server.

And in this article he compares his approach with using JSONP because JSONP is basically just a means to retrieve some data returned as a JSON object. And then have a callback function that you define on your browser side code to process that JSON data.

And he compared this approach and make some claims about advantages of using this Cross-Domain AJAX approach with this article namely... he claims that JSONP is limited to retrieving JSON data. And if you want to actually retrieve some executable code, JSONP is probably not the most adequate method to do that.

He also claims about difficulties to handle errors using JSONP although I think it's probably depends on the way you implement JSONP, maybe he's thinking about specific libraries, but JSONP is just a protocol and there is error handling in the middle, I don't know if you can blame it to the JSONP protocol or an actual library that implement it because maybe you can add some callback handler to handle errors, but that it's not common usage way that libraries that implement JSONP provide.

Michael, did you read this article? What are your thoughts?

Michael Kimsal: I did read it. And I don't disagree with any of his conclusions and I'm not trying to have a whole lot to add.

I did like the fact that in his Cross-Domain AJAX library that he pays attention to the error handling as he points out that JSONP itself there's no standard mechanism for dealing with errors if for some reason the server comes back to something else you're left to deal with that on your own, as with a lot of AJAX sort of things you end up building your ownor you end up either using something that you cut and paste or developing your own sets of libraries or idioms for dealing with errors.

So I like that he took that into account. A lot of people write a library and here's what goes up and don't ever focus on how to deal with error conditions. So I thought that was almost a requirement because if you're not going to do that then I'm not sure that the library made necessarily had as much use outside of the Cross-Domain stuff.

Manuel Lemos: Yeah. I think dealing with errors is a matter of maturity that the developers, most developers when they begin they do not tend to do much error handling because it's boring, it's a part that they do not want to deal because first it's not usual to get errors. Errors are an exceptional situation.

But for instance in the case of AJAX request or something, regardless how they are implemented I think in the worst case you should deal with timeouts because if for some reason your server is not responding or the user internet connection dropped, and he's left to wonder why it is not responding. It's not good usability practice to not deal to at least timeouts.

Michael Kimsal: The other problem I think, well I can speak from my own experience I know when I first started out I didn't write any errors. I never had any errors, so just trying to say, how can my code break when it was so awesome to begin with.

It was actually a struggle to write any error handling code for several years because I was that good. I know that's not a problem that you had. I know that's not a cross that you had to bear so you probably can't relate. But there probably some other people out there that can relate to being as awesome as I am.

Manuel Lemos: [Laughter] And humble.

Michael Kimsal: Yeah. I didn't. Those weren't my words, those are yours.

Manuel Lemos: OK.

Michael Kimsal: OK.

Manuel Lemos: Right. Well, anyway personally maybe I'm not the best person to talk about because I do not write so much JavaScript code directly, but usually it is something that comes from the server usually in PHP, but many years ago I developed a forms library in PHP that a great part of its purpose was to generate JavaScript to be run on the browser side.

To make the applications more usable and it comes with a plugin to perform AJAX request. Actually they are sort of emulate AJAX request using Iframes which is basically a similar approach to Hensel's component.

But if for some reason there was an error like the server has a bug and generated some invalid JavaScript and return an error in the browser and the condition that would tell that response has been loaded would never happen.

And the way that I dealt with that situation was to implement a callback that would be executed after a given timeout period and the default implementation now was the callback function just to show a message to user or for some reason there is a problem with the communication with the server.

Manuel Lemos: Well, at least it is some feedback, usually could probably give more instructions to the user or maybe need to reload the page, or comeback later, or go complain to somebody else.

Michael Kimsal: Send me money.

Manuel Lemos: Right. Send me money and I fix it.

Michael Kimsal: You know it's interesting having a built in bug reporting system with an app that also had some sort of a Paypal integration to it would be really, really interesting. And saying that somewhat tongue and cheek, I don't know how he talk that way.

But the interesting, I've never seen payment I guess bug bounties or sort of that way, but the idea of saying, "Hey, when you submit a bug report Paypal made $30.00 and that would put you at the top of the queue.


Michael Kimsal: That would probably be an interesting thing to do.

Manuel Lemos: Yeah.

Michael Kimsal: But developer are so... money is so below, just outside of their thinking.

Manuel Lemos: You know, they don't like money, they just want to code and they are happy.

Michael Kimsal: Yeah. Because all their Macbooks just come for free. Yeah. Anyhow, speaking of timeouts, let's move on to the next section. Ho! Ho! Ho! And see how that I did that transition.

Manuel Lemos: Yeah.

Michael Kimsal: It was awesome.

Manuel Lemos: Well, anyway before moving to the next section on which you're going to comment about the latest classes published in JSClasses...

Michael Kimsal: That's what..

Manuel Lemos: well in the podcast and that's the regular section that comes after this, but it's related.

I just wanted to live a note to encourage developers not only to publish their packages in the JSClasses site so we can talk about them, but also write articles about them because if you write articles on the site, for those that are not aware, each package that is published on the site is associated to an internal blog on which you can publish articles to tell more about your packages and so the users can learn more about it.

But if your article is interesting, is not so specific to your package and you can teach people more about generic stuff somehow related to your class but it's useful for everybody, you can write an article and you can flag an option there is in the article submission forum that requests the article to be featured.

And once the article is featured to show as if it was part of the main JSClasses site blog and that's what happened with Hensel's article. The article became featured and it was also syndicated by other sites that aggregate the feeds from sites from the JavaScript world like the Planet JavaScript aggregator.

And your article also gets visibility there. So that's a way for you top get more exposure.

Latest JavaScript Objects published in the JSClasses site (42:12)

Manuel Lemos: And now we're finally moving on to this upcoming session of the podcast. We are going to talk about some of the latest packages published in the JS Classes site.

And well I just said before this was sort of a slow month probably because everybody is on vacation probably in a warm beach they don't want to bother with programming because they are on vacation, but there were still a few packages that we are seeing that were posted here in the latest packages published in JS Classes site.

And given that, Michael, would like to start talking about the packages that are more interesting.

Michael Kimsal: Maybe. If you would just keep your hair on for a minute at first screen share. Oh my goodness.

Manuel Lemos: You are on your vacation costume?

Michael Kimsal: That was my underwater sound. That was bubbles going up. It probably sounded bad, didn't it?

Manuel Lemos: That was a cool effect and now I know why the person doing the script I know is going to transcribe that.

Michael Kimsal: Yeah. OK. Well, first one we got and I was going to use to say, speaking of transitions before timeouts and all that, Artur Sosins has Page Transitions class out and I've got... I'm trying to share... Oh, no you got that. I'm trying to share the screen, why am I not.... Are you seeing my... you're not seeing this.

Manuel Lemos: Yeah. I see. You just need to switch to the right page.

Michael Kimsal: OK.

Manuel Lemos: OK. There it goes.

Michael Kimsal: No, no. That's not it. I had... where did it go?

Manuel Lemos: A demo.

Michael Kimsal: Yeah. I had this demo up which maybe I deleted. So I'm going to go.

Manuel Lemos: There is a link on the package page.

Michael Kimsal: Yeah. He's got a link here. It's actually little hard to find. Arturs not this, but I mean your... where did that go? Is it deciding? No. It's just going to be really slow.

Manuel Lemos: It's next step.

Michael Kimsal: Yeah. But it's down here it's Examples in Action and then you have to click something else again. Test one. This is an example of it, hopefully this will come through decently in terms of there's a number of options here at the top, left to right, right to left, top to bottom, from bottom. So if you click that it will do an actual transition. It's jerking a little bit.

Manuel Lemos: Too many tabs open.

Michael Kimsal: OK. It drops down, then it comes up another page from the bottom.

Manuel Lemos: Yeah.

Michael Kimsal: Or you could do vertical flip and it will, as you see do a vertical flip between... it's doing it between two different pages. So it's a whole library of these sorts of effects to user transitions to use.

Manuel Lemos: Yeah. Very cool.

Michael Kimsal: There you go. Back to you, Manuel.

Manuel Lemos: Well, actually I was wondering how did it work because you can implement some animation when the page exit or on unload I think, or maybe some other related event. But when...

Michael Kimsal: I was trying to do a view source on that page, and I don't think I'm going to try that again because...Well, it's interesting, well no. I was thinking no, I'm in a different browser. No, I'm using Firefox for the hangouts and I was doing that on Firefox as well. So doing too much obviously in Firefox caused the problem.

But yeah, I don't want to give away too much. I would encourage people to go to and look at that page, look at that code themselves. If you give away too much like, why would they buy a cow, when they can just buy the book for free? Or why would they read it?

Manuel Lemos: Buy the report, the summary for free.

Michael Kimsal: Yeah. Exactly. Exactamundo as Fonzi would say. It's probably little before your time, though?

Manuel Lemos: Probably it was also my time. [Laughter]

Michael Kimsal: OK. Well.

Manuel Lemos: Well, anyway it was yet another impressive class from Arturs. Arturs always publishes a regular batch of classes, but this time we had just have one class to talk about this month probably because he is also on vacation. Everybody on the North hemisphere is on summer vacation.

Michael Kimsal: Not me.

Manuel Lemos: Right. But you never stop, right?

Michael Kimsal: Can't keep a good man down. Actually, no. Can we erase that part? Never mind, go on.

Manuel Lemos: I was wondering if you weren't you going to comment on another class?

Michael Kimsal: Well, I felt we would go back and forth? I thought that's how you wanted to work this. No, OK. OK.

Manuel Lemos: OK. Go ahead because..

Michael Kimsal: That's what has come to. The other one this month of note was a Text Reveal from Nguru Mugendi.

Manuel Lemos: From Kenya.

Michael Kimsal: From Kenya if we're going to say as the British would say it, or Kenya to appeal to the rest of America, United States of America. There's actually a demo page for this as well too. And a demo page was..

Manuel Lemos: Related links, did you open already?

Michael Kimsal: I actually got the code and I was running it and look at that... let's see. There we go, look at that. I'm not sure this is working as I was expecting it to, but reading it, I'm not sure if there's another way.

The idea here is it reveals text line by line as the text is scrolled over. Supposedly useful for long textual pages, but when I do this and it may jump a little fast for you. But when I scroll over it, it make something and may hover for more. It sort of keeps adding as I scroll it's adding more text.

Manuel Lemos: Yeah.

Michael Kimsal: Maybe useful and yes I can imagine some other use cases for this. On this demo page it doesn't quite feel as much because I guess there's so many of these as I jump and hover over them. And actually when I was doing it before it was actually jumping the pages around a lot more. It's not doing it as much now as it was.

Manuel Lemos: Could it... I understand it probably looks a bit confusing because its jumps.

Michael Kimsal: It may. I mean, technically it's doing what it says and I can understand what it's doing, but it maybe that this effect would work, would look better and present better in a more controlled... with a more specific demo like I did it because Imagining it that... and I'm also imagining that Nguru is a male,  I'm imagining that he put this together probably for a particular project or a use case. And seeing it in that context would have helped me understand it better.

Manuel Lemos: Yeah.

Michael Kimsal: But that said it's there and it does what it says.

Manuel Lemos: Well, maybe in the next revision he puts on a more smooth animation when it expands the text because I think it's probably too fast than the showing all that additional text all at once.

Michael Kimsal: Yeah.

Manuel Lemos: When people maybe wondering if they lost something.

Michael Kimsal: Yeah. But again without knowing what the purpose behind it was, it may have been a very good solution for the original purpose. As a general purpose object or class, I would need to see more visual context.

Manuel Lemos: Well probably it was yet another of those solutions to not take so much space in pages and still show a bit of the beginning of the text, so people may evaluate if it is worth reading more, I don't know I think that could probably be the purpose.

Well, anyway on my part I also would like to mention a couple of classes. Let me screen share here. And starting from actually a framework called jsframe by José Manuel Carnero from Spain.

 And basically what this framework seems is pretty much like what what jQuery, basically a way to manipulate DOM elements access them, and locate them, and then do something with some plugins like a few that he already provides for performing AJAX requests and probably moving some DOM elements around the page.

Well, I don't know what would be the motivation for José to develop this library because since it seems a little bit much like jQuery. Maybe he just intends to develop a library that provides some of the functionality, but probably not as long as jQuery because jQuery since it has already evolved a lot it's getting some weight.

We even mentioned in previous episode of the podcast that they are considering to take off some parts of the jQuery that support all the browsers in the future versions of I think the jQuery 2 or 2.1, I'm not sure.

But maybe it was the purpose. Well, anyway I think despite jQuery is very popular it's not all to everybody and it's always right to see alternatives whether there is great overlap or not on jQuery. Well, I think at least that is my opinion on this. I don't know if you checked this library, Michael? If you have any additional insight?

Michael Kimsal: I don't. I've looked at it, but I haven't run it.

Manuel Lemos: Yeah.

Michael Kimsal: So I don't have anything more to add.

Manuel Lemos: OK. So it's time to move on to the next package that I want to comment about. This time is one by Ihor Khomyn. I'm sure it's not the right way to pronounce his name. But, OK. At least I tried.

He is from Ukraine, and provided a package to manipulate dates. Actually spell them in English words. But the way he did it, it can cover dates that go from ranges of billions of years. And other than that he also provided a PHP version of this class.

So it does basically the same, but in PHP. And at least in PHP there is that limitation of when you want to manipulate dates, it's easier if the dates are not before 1970 which is..

Michael Kimsal: Timestamp. Unix timestamp, yeah.

Manuel Lemos: The epoch origin and everything else that goes before 1970 you need to have some custom code because for PHP does not provide much purpose.

Michael Kimsal: The DateTime stuff, I say new. The DateTime, the PHP 5.1 DateTime classes and stuff I think do a good job of free 1970 stuff.

Manuel Lemos: Yeah. That's something of the newer PHP versions. What I was talking about is I mean, traditionally you have to rely on some custom code to manipulate, but in this case it's just to convert dates to spell them.

It goes to billions of years, AD or BC and I thought it was interesting to comment here. It's a pretty simple library and maybe who knows if we have a need to spell a date, you can find a good use for this library.

Michael Kimsal: Yeah. I was kind of hoping to see something like June 12th, negative 7 Billion BC.

Manuel Lemos: Negative.

Michael Kimsal: So it wasn't -it seems like at some point the granularity he stops talking or the library stops talking about particular months and days and just deals in years. It would have been nice to be able to maybe do use this in social like an AJAX calendaring thing to make a plan for May 9th, 7 Millionth and just look on your calendar and see if you're busy that day.

Manuel Lemos: [Laughter] OK. I think not. Well, I don't think I would be available on that time.

Michael Kimsal: You can't be sure because you can't check in your calendar, that's what I'm saying.

Manuel Lemos: Oh, I see.

Michael Kimsal: Yeah.

Manuel Lemos: Well, anyway. The idea of this library is to use integers very large integers to store the dates and then use the library to convert them to show them in English. It has several options to format the dates and it's interesting because when you store in the database you have to find a format that is suitable. Even in database that use the ISO format the years only accommodate four digits.

Michael Kimsal: Bastards. Those bastards. Always cutting corners.

Manuel Lemos: It was not meant for a year range that you would not be alive.

Michael Kimsal: Yeah. Way to tell me how to use my own software. I don't know what I'm going to use it for?

Manuel Lemos: You won't be alive, but your descendants.

Michael Kimsal: Well, OK. Maybe I'm not, but the software should still be running. I should have an expectation that I can schedule something for the year 29,607.

Manuel Lemos: Celebrate your one Billionth anniversary.

Michael Kimsal: Podcast, yeah.

Manuel Lemos: Podcast.

Michael Kimsal: My billionth download, there you go.

Manuel Lemos: Or maybe your birth?

Michael Kimsal: Hey, hey. Now you're just getting ageist. Well, I don't want to get into age things right now because really sensitive about that.

Manuel Lemos: [Laughter] Well, OK.

Michael Kimsal: The gray hair.

Upcoming issue of the JSMag Magazine (56:35)

Manuel Lemos: Now, more on a happy topic, we are going to move on. Finally one of our last sessions, regular section on which Michael talks about one of his reasons for being happy which is his magazine JSMag.

Michael Kimsal: Well, yeah. And as always we're still kind of behind or on target with schedule, but there's a couple of..

Well, one continuing we've got Dr. Janine Myer because she continued to contribute articles on various effects on transitions. And I think there's a part this stems from some of the lessons that she does because she teaches a class on what technology in New York, some place I apologize, Dr. Myer I don't remember the actual name of where you're lecturing.

So that kind of continuing series on that. And the one other piece that I know should be... I think it's going to production as we speak right now is on 'node.js clustering.' So if you have multiple node.js servers, you want to cluster them, there are some different techniques and options available.

So we've got an article that will be going in a more detail on that. And there's some others that I think are coming up, but I hate to say yes on something because we always make last minute changes.

Manuel Lemos: Yeah.

Michael Kimsal: So those are coming up in early September. We should have that issue out I think by September 3rd which is a Monday, a little over a week from now.

Manuel Lemos: Yeah. Just wanted now that they had talked about it, so when you subscribe to the magazine you get like what 12 issues?

Michael Kimsal: Well subscription is using kind of traditional print publication scheduling. It would be 12 issues, one year. Usually people will start until they want 12 issues they'll start with the current month and they'll get 11 more in the future every single month.

You could say I want a series of 12 and go back and start at the beginning or start at any other time. Let's say I want this consecutive set of 12. So that's you can essentially back date a subscription to start in the past which has worked out reasonably well so far, that's what that means.

Manuel Lemos: But would can you still order individual past issues?

Michael Kimsal: Yes. If you want to go back and just say, "I just want this one issue," which well you get sometimes somebody because an author will have reference and article and say, "Well, I wrote this in September 2011," and they'll link to that, and people come and just buy that one issue because they want that one, they want something from that particular author or they want that particular topic.

Manuel Lemos: So is that part of the subscription or I have to make that separate purchase?

Michael Kimsal: No. It's just a purchase. That would just be one off purchase.

Manuel Lemos: OK. That's interesting because I'm sure some people probably maybe interested in specific topics that were covered in past issues and at least with that information I think they are clarified.

Michael Kimsal: And at some point we will have this have been, it's not even under development because the tech is not that hard, but we will have a stronger search at some point. The idea of searching for particular topics or content.

Manuel Lemos: Yeah.

Michael Kimsal: We unfortunately we did not start from day one capturing all this information. And now they are more than three years of content that we have not captured metadata on. So going back and recapturing all that metadata is the difficult part right now. But that would be once that is all kind of recapture, we'll be capturing it going forward and make the site searchable.

Manuel Lemos: OK that's good.

Conclusion (1:00:22)

Manuel Lemos: OK. We have practically reached the end of the podcast.

Michael Kimsal: [Singing] Although we come to the end of the podcast. You should have sung that with me. We could do a duet.

Manuel Lemos: No. I could, but I do not recall that... well my culture is limited. [Laughter]. Anyway..

Michael Kimsal: Your words into mine.

Manuel Lemos: Yeah. Well, Michael's right, I'm humble. Well, actually I was wondering because you put to your label about indieconf if you wanted to comment anything new about it or..

Michael Kimsal: Oh, well yeah. indieconf, our conference for independent webpreneurs and solopreneurs, independent freelance developers, designers, and so on. That is scheduled at November 17th. Is it November 17th? I mean just double check.

It should be in my brain, but for some reason. Yeah. November 17th, which is a Saturday we've had a call for papers open and that is closed. I am in the process of selecting first round of speakers.

Some of the speakers will be coming back from previous years and they're great. Probably about a third of the people that we've had in the past will be coming back again and we've got some new speakers.

I am in the process of selecting and then contacting people because I try to do at least a phone call with everybody to make sure that they're actually human being and what they submitted that they actually are competent to talk about it and so on. So I plan to have at least I say the first round maybe the first half of the speaker selected and posted at this week.

Manuel Lemos: Yeah.

Michael Kimsal: So we got about three months, about two and a half months from now.

Manuel Lemos: So they got to call.

Michael Kimsal: Tickets are on sale you can go to the website, you can buy ticket right now. Please go site buy ticket right now.

Manuel Lemos: And support the independent developers.

Michael Kimsal: Yes.

Manuel Lemos: OK. So you are in the phase of picking the talks, right?

Michael Kimsal: Yup.

Manuel Lemos: And you'll be announcing those that were selected soon.

Michael Kimsal: Yup. In the next week. And we've got actually I think I may have mentioned this before. We put up some videos, I probably will have a couple more videos up this week from last year's sessions. It's really just converting them, takes a long time.

But it kind of spends the breath that we had session on public speaking at session SEO, web SEO session on publishing and another session on just general business practices which really covers the gamut of the types of things. It's some technical and some business, but everything organized around people who are independent.

Manuel Lemos: Right. Well that's good to know. Maybe you can comeback to future episode and talk more about the talks that were picked and so people may decide if they would like to go based on that information.

Michael Kimsal: Yeah. There's at least one Javascript talk I know there maybe two in terms of raw tech that's about the level that we get at. We don't really get into PHP versus DotNET, versus anything, but everybody deals with JavaScript. So I think we'll have at least one, but maybe two JavaScript sessions.

Manuel Lemos: Yeah. But there are many independent JavaScript developers that would be interested on the whole event, not just on JavaScript.

Michael Kimsal: Sure, sure. I mean, yeah. I was just kind of saying in terms of there is some relation to our podcast here as well.

Manuel Lemos: Yeah. OK. Basically we have ended our podcast, I just wanted to conclude. I don't know if you have to reveal what you finally got your.

Michael Kimsal: I did, I'm sorry it's sitting in my wife's room right now.

Manuel Lemos: Oh, she's monopolizing.

Michael Kimsal: Yeah. She's basically taking the elephant.

Manuel Lemos: Well. I need to step away to show it again to the..

Michael Kimsal: Yes. That was really generous. Manuel sent an elephant all the way from Brazil up to U.S. Thank you.

Manuel Lemos: Well, it's my pleasure. Sort of a symbolic reward for your long time cooperation. It's always a pleasure to have you with us and sending you an elephant is the minimum that I could do to compensate for your trouble to be a co-host on this episode and also being helpful on many other aspects.

And other than that I just want to remind everybody else that is on the podcast that the Innovation award of JS Classes site challenge is still going on. Since we didn't have much packages this month being published the progress did slow down a bit, but is getting higher, it's on 85%.

Michael Kimsal: You'll hit that. You'll hit that by the end of the year certainly.

Manuel Lemos: Yeah. That's the expectation a year. It's says 2013 January 4. It's the estimated goal considering the average of the last month. But usually this tends to go down as people get back from vacation and starts making more packages.

And this was related too with elephant because the top five contributors that send more packages considered notable until that date they will get an elephant. So if you are interested, not just to get the elephant, but to expose your JavaScript work, this is all you have to do is send the packages to the site and also benefit from the exposure.

And then also something else that I'll talk more about it in the upcoming months. Something new that I've been working on that will provide more how would I say rewarding experience to those that share their work in this podcast.

Well, I think for my part that's all for now. I don't know if you have any far more remarks, Michael.

Michael Kimsal: I do, but they were probably just get edited out anyway because I'm not sure you can actually say them cross continental borders. So I'll just leave it at that.

Manuel Lemos: OK. Well, thank you all for coming. See you next month. Bye

You need to be a registered user or login to post a comment

Login Immediately with your account on:


No comments were submitted yet.

  Blog JS Classes blog   RSS 1.0 feed RSS 2.0 feed   Blog The Speed of JavaScri...   Post a comment Post a comment   See comments See comments (0)   Trackbacks (0)