Category Archives: Internet

Youtube like progress bar using NProgress.js with Angular.js

Posted on by

NProgress provides decent and attractive Javascript library to get a nice progress bar similar to the Youtube one. This is very sleek and classy, I love that and it’s very useful for the Single Page Applications.

You can download NProgress.js from http://ricostacruz.com/nprogress/

If you’re doing the development in Visual Studio you can install the NProgress from the NuGet. It is very simple library. When you install NProgress you get all the other dependencies as well. NProgress has one simple CSS file which very easy to work with and handle.

image

It has 4 methods.

  • NProgress.start() – to start the progress bar
  • NProgress.set(0.5) – set the progress bar value; ranges from 0 to 1
  • NProgress.inc() – increment the progress bar value.
  • NProgress.done() – complete the load process and hides the bar

Let’s see how to use with Angular.js. Better practice is to use the progress bar in background operations or when the UI wait happens. In this sample I didn’t use $http service of the Angular I just used $scope.

The HTML goes like this.

image

nprogress.css is the style sheet where you can control the behavior of the progress bar. It also contains the code for the spinner. If you want you can disable the spinner by simply commenting the code. Spinner only has start and done methods. HTML contains 3 Javascript references nprogress.js, angular.js and the custom controller AppController.js.

Code for AppController.js

image 

You can this is a very crud code sample, when request data from web service using $http service, you can call NProgress start and done methods appropriately. 

I also did some color changes in the nprogress.css file and made the progress bar to red.

image

Advertisement

HTTP Performance Tuning

Posted on by

When we talk about the HTTP performance of a web site or a web page mostly we regard to the speed the content delivered. If we summarize all the parameters of the web performance we can stick to these 3 golden rules in order to gain high performance.

  • Reduce the number of HTTP calls (Reduce the number of requests to the server)
  • Reduce the size of the content in the requests
  • Send information infrequently

These are some common practices to boost up HTTP performance.

HTTP Compression – Most of the web servers support this option. HTTP compression can be static or dynamic. In the static HTTP compression web server saves the compressed version of the content files such as CSS and Javascript. In the Dynamic compression the response HTML is compressed and sent to the client. Dynamic compression works well but eats up more CPU in your web server. Mostly static compression is configured in the web servers by default

Minification – This is a well known method for the Javascript developers. We can do minification to CSS files as well. We reduce the size of the files by removing comments, white spaces, shrinking variable names and ect. There’re plenty of Javascript minification tools available online. jQuery.min is the best example for this type.

Content Expiration – This is the cache in the browser. Browsers check for the new versions of the files and they download the files only when a new version is available. This is good since it reduces the size of the calls to the server, but if you have many small files and the browser goes on checking all of them it will be a performance hit. So better include your files in the relevant folders and set the expiration to the folders.

Content Delivery Networks – CDNs are well known and highly used by many. Geographically distributed so this reduces the travel time of data. CDNs are mostly used to deliver the static content.

Image Optimization – By optimizing the images we can reduce the size of the requests. JPEG and PNG are the heavily used file formats in the web. There are plenty of image optimization tools available. JPEG Tran for the JPEG images and PNG Crush for the PNG images are widely used and light weight.

Acer is not affected from ‘Heartbleed’

Posted on by

This is the email I got from Acer couple of days ago.

image

Facebook ✔ seen 01:58

Posted on by

 

You might have noticed that recently FB added a new feature in the chat to show whether the other party you are chatting with have seen the messages you send or not. This is a cool feature for some extent as long as I can check whether my friends have seen the message I send. But same theory applies to me as well. I personally do not like this much.

There are plenty of other ways to avoid a person in FB. Simply I can make myself offline to that particular person. But let’s discuss about something really wobbly about this feature.

Technically speaking this seen feature can be implemented in many ways. And also a real question I have in my mind is ( and FB did it in a very sneaky way) to know whether FB assures that the other person read it or not. The answer is No.

I tested few scenarios of this ‘seen’ feature.

The rule of thumb is, FB detects the seen when and only if your browser tab on which FB is loaded and the chat window of a particular chat are open and in focus.

Simple.

And FB says whether the user has seen the message or not. It doesn’t say anything about whether the user has read the message. Because FB sends the seen acknowledgement to the other party approximately after 8 – 9 seconds from the time it got the focus event fired. In some cases this time is very short; something between 1 – 3 seconds. But it doesn’t bother about the length of the message whether the message can be read in 10 seconds or not. So it just says the users has simply seen the message. It makes perfect sense.

In Windows 7 we can hover the taskbar icons and get the full snap of the windows we have opened. From the OS perspective this is not focus. This applies to FB as well. Because technically in FB this feature works on Javascript focus events which get the focus signal from the browser, where the browser get the triggers from some sort of a system call from the OS.

So you can use this method to read the messages without getting caught. 🙂 but this is not always possible and easy.

Hotmail Connecting other mail account hidden policies :)

Posted on by
http://www.facebook.com/widgets/like.php?href=https://thuruinhttp.wordpress.com/2011/08/29/hotmail-connecting-other-mail-account-hidden-policies/

In Hotmail you have the facility to connect other mail accounts of yours. So in a single log on you can check other inboxes as well. This is a cool feature as we can link non Hotmail accounts as well. I have linked my Gmail with my Hotmail.

When you do this you have to provide the credentials of the Gmail account and connect it to your Hotmail. Actually Hotmail does not open the Gmail inbox inside your Hotmail, but it asynchronously downloads the mails from the Gmail. (this is bit not nice, but there might be policy boundaries among the companies).

So the bad side is, if I open and read a mail sent to my Gmail, from the Hotmail; and when I login to the Gmail it still shows that particular mail as unread. So my credentials are used to connect to the Gmail, and not for maintaining any sync, it is just for the download.

And we think this is right. Because what ever happens there might be organizational policies that prevent to do this. Simply Microsoft does not have permissions to edit Google inboxes. 😛

Another scenario is, since this connection is a mere download of the mails there is no impersonation is implemented. I’ll explain my real experience here, I have signed to a Google group using my Gmail ID. So any mails sent by them obviously come to my Gmail account as well as my Gmail folder in the Hotmail.

When I clicked the mail from the Hotmail and it had a link to a shared Google doc among the group members, When I clicked on the link, I was prompted to sign in to my Google account. That’s the point, there is no impersonation. (or my Hotmail has no way to explicitly pass the information that I’m the user of the same Google mail, though it has my Google mail credentials).

They use the credentials only for downloading the mails and not for any explicit impersonations. :D.

Pin websites to Task bar – IE9

Posted on by

IE9 offers a great feature that you can pin the websites in the task bar and navigate them very conveniently. The cool feature is once you pinned a website to the task bar, you can access the website like an application. It offers jump list features and direct access to those features. And in the task bar the website icon is displayed; this makes it very cool to have that feature.

If you want to pin a website in your task bar simply drag and drop the site tab to your task bar or press Alt + T and then M and press Add in the dialog box.

To make your websites to be compatible with this feature we have to develop our site in a way that it can be added to the task bar. This MSDN article describes about making the websites in such a way.

But I still have doubts on this feature whether plenty of people will use this or not. Though the indirect Windows marketing strategy is there, still there are some benefits on this method. But based on some HCI principles I really doubt on this feature.

Modern Browser . . .

Posted on by

Yesterday I made a status update in the Facebook as ‘Modern Browser ?’. I didn’t get any comments under that as I expected. Because it is a senseless update for the people for who are not aware of the real browser war going between Mozilla 4 and IE9 RC. (Of course browser war is not new but this something different, funny and interesting)

I’m not supporting any of the browsers here (I use IE, Mozilla and Chrome for different purposes), but it is a fun to listen to these arguments.

I got theses two blog articles via an email subscribed to Codeproject, both are very interesting. Especially the IE9 blog article where the guy gives explanation on what is meant by a modern browser. This is really cool. I’m not supporting but it looks like linguistic studies and IT pros are banging each other on the words they used. (This makes a feeling of they can be in a law suite department rather being in the IT field Smile with tongue out)

Just as a fun have a look on these two blogs

http://people.mozilla.com/~prouget/ie9/

http://blogs.msdn.com/b/tims/archive/2011/02/15/a-modern-browser.aspx

Facebook

Posted on by

The greatest social networking giant with more than 500 million users. Wow 500 million what a great number. We can see almost all the businesses having their pages or ads or something in FB; from Microsoft to the Dosa Shop near my campus. 🙂

I thought about some features that FB may implement in the future, and some features which I consider as nice to have.

FB can give some themes to decorate the home page as we want. These can be pre defined themes as Windows Live provides or they provide an editable CSS as MySpace does. I read in a blog entry this feature is not implemented because FB wants to ensure the same loading time in all the pages and no more delayed loading. But whatever it is it would be nice to have themes as we want.

Another advanced feature and I name this as ‘Facebook Globe’ which would be a prototyping tool to visually maps the relation ships we have and the links and the data shared. In highly advance this can also maps photos and able to create panoramic photos. Wow that will be really great and sounds interesting. Do not steal this project idea.

Just wanna share some thoughts on Facebook. Put your own suggestions and ideas that FB can adopt in the future.