Using requestIdleCallback — Google Web Updates

requestIdleCallback is new performance API for scheduling work when the user is idle.

Source: Using requestIdleCallback — Google Web Updates

Another functionality from Google Chrome that can make our JavaScript execution faster with this already fast browser. As I say faster I mean that the user experience will be improved as this kind of functionality allows us to execute some heavy code while the user is idle: reading a block of text and not clicking at the time, etc. With feature detection you can implement that right now and I hope such things will be widely adopted.

Handling Sync Tasks with Gulp JS |

Source: Handling Sync Tasks with Gulp JS

Today I really needed some order of execution of the grunt tasks I defined for my latest project. At the same time I wanted these smaller tasks to be separated, not just a single huge pipe or nested functions. Well I was in luck because on this article above everything is explained with a great examples.

Bootstrap 4 alpha · Bootstrap Blog

Official blog for the Bootstrap framework.

Source: Bootstrap 4 alpha · Bootstrap Blog

Wow. They’ve rewritten everything. They switched from Less to Sass, from ES5 to ES6 and even dropped IE8 support! So much things that can make me happy! I just need to calm down and prepare for the final release while in the mean time looking around for sites that already use v4.

Announcing Ionic Lab: Mix it up with our new GUI tool | The Official Ionic Blog

Source: Announcing Ionic Lab: Mix it up with our new GUI tool | The Official Ionic Blog

Another great tool from Ionic! This time you have the possibility to design and run your mobile Ionic apps locally using their brand new GUI. Currently it’s for Mac OS only but a Windows version is coming and I hope they will make a Linux version too.

Seven Surprising JavaScript ‘Features’ |

A look at some of the more unusual parts of JavaScript by examining seven things I’ve learnt recently.

Source: Seven Surprising JavaScript ‘Features’

Interesting usage of JavaScript labels, destructuring, same name variables, class declarations, comments and more. Be sure to read it thoroughly to get the feeling of the inner JS works.

JavaScript: from callback hell through then-hell to generators+promises

Lately I’ve been refactoring and then refactoring and then some one of my JS apps every time I find a better way to handle the asynchronicity of the language. The app is a MEAN stack app but I am working mostly on the back-end built for Node.js with the intention to do the same for the front-end when I am satisfied with the back-end code.

So I started writing a Node.js code using the callbacks everywhere even some of my custom functions(in other apps) were made to receive and call callbacks. I was very happy how the callbacks looked like and I was writing them as the second parameter of the functions without thinking: callAsync(params, function(err, data)) all the way!

However little by little I started to add new and more complicated features and the need to nest multiple callbacks did arise. Add to that the checking for error on every callback first line and the code started to be hard to read.

At some time I discovered Promises. I decided to use the bluebird Promises package. It follows the standard and also provides additional functions that at some time are really needed. I was in love and probably still am with the then-chaining, calling async functions, attaching then() to them, returning a new async call that provides a Promise and checking the result in the next then, adding a catch() function to handle any error in the promises chain and avoiding the need to check for an error in every then(). The code was beautiful again and no pyramid of doom existed anymore.

However Promises and then-chaining created a little overhead where every then() needs a callback function and also this callback doesn’t have access to variables in the previous callback – only the result from the previous promise call. There was a need to declare helper variables in the outer scope: the function where the Promise chain is.

Then I discovered generator functions. Their basic usage doesn’t show that you can use them in place of callbacks or Promises but the fact that yield can receive a Promise makes them very interesting. Of course there is a need of a wrapper function to call the generator’s .next() and check its .done status. I decided to use the co package for that.

After all of this the code I use is similar to this one:

co(function* () {

  let user = yield User.findOneAsync({ _id: 12345678 });
  console.log('user', user);

  let user2 = yield User.findOneAsync({ _id: 112233 });
  console.log('user2', user2);

}).catch(function (err) {

The code above will execute synchronously. Pretty cool, huh?
User.findOneAsync() returns a Promise. yield-ing a Promise will make this type of configuration to wait for the Promise to be resolved/rejected. The resolved Promise’s value will be assigned to the variable on the left(user/user2).

Now the next thing for me is to use ES7’s async functions. I can run ES6 and ES7 code with transpilers like Babel on the back and front-end.
Async functions’ syntax is similar to the one with the generator above without the need to use a wrapper function. I am thinking to wait a little before using them and keeping the code close to what is available natively in the latest Node.js/io.js which is ES5/ES6 syntax at least until the near future(next year?) when the ES7 will be finalized and ready to be used/implemented in the JS engines.

Optimize Your App’s Growth with Ionic Analytics, Now in Alpha! | The Official Ionic Blog

Source: Optimize Your App’s Growth with Ionic Analytics, Now in Alpha! | The Official Ionic Blog

I am really excited for this feature. And it comes not long after the Ionic Deploy feature which is equally exciting! Go to the page to register for the analytics and to see how to prepare your app for it + check in the docs how to create custom tracking events.