Friday, August 1, 2014

Bootstrap Youtube Playlist Popup Player Plugin

In continuation to my previous Bootstrap YouTube Popup Player Plugin, which was only good for playing a single video, I've created another version which can work with a play-list of YouTube videos. It uses Bootstrap's Modal Popup to embed the YouTube Player and does not need any extra CSS at all.

Use the link below to view a demo or read the documentation on how to include this on your page. You can download the latest version of this plugin’s library from Github page.

Demo and Documentation: http://lab.abhinayrathore.com/bootstrap-youtube-playlist-popup/

Github: https://github.com/abhinayrathore/Bootstrap-Youtube-Playlist-Popup-Player-Plugin

Monday, March 31, 2014

Website Performance Optimization Checklist

Building high performance websites is very important because it helps in increasing the conversion rate on your website, especially eCommerce websites. There are many statistics on the web which proves that high speed websites retain more users and hence more revenue. You can checkout this nice info-graphic for a quick comparison. Even if you are not able to score a perfect 100 (not even Google.com) on the Google PageSpeed Testing Tool, at least try to stay above the 85% mark.

There is no single-bullet solution to making your site performing at top speed because every application or website is different in terms of it’s user base, data and interactivity on a multitude of devices. There are a lot of automated tools coming up like Google’s PageSpeed Module which will do most of the stuff for you or a plethora of automated build tools to perform optimizations at deploy time.

I myself was learning a lot of performance optimization techniques for my small sites but there isn’t once place where you can find links and tips to all the tools required. So, I thought of creating an exhaustive checklist of front-end performance tips and tricks. I am not a Guru in this field but this is my earnest effort to help other people like me who wants to do more fine grained optimization apart from using the automated tools.

Please visit this page and let me know if you know of any more ideas/tools/tricks which I might’ve missed:

http://lab.abhinayrathore.com/website-performance-optimization-checklist/

BTW, none of my websites will score 100% on Google PageSpeed Testing Tool because I simply don’t case that much optimization in favor of easy maintenance and ease of linking external libraries through CDN :)

Tuesday, March 11, 2014

jQuery Coding Standards and Best Practices

I’ve been using jQuery for the past couple of years and have seen a lot of bad practices and lack of standards knowledge between the developers. It’s always better to have standards defined around big teams so everyone’s on the same page. I took this effort to unify the coding standards and best practices around jQuery under one page so others can build upon it. Not all standards may apply to your application so feel free to use whatever works best for your application domain.

http://lab.abhinayrathore.com/jquery-standards/

If you find any mistakes, have any suggestions or comments, please feel free to drop a word below this post and I’ll try to address it as soon as possible.

Thursday, March 6, 2014

Bootstrap YouTube Popup Player Plugin

If you liked my previous jQuery YouTube Popup Player Plugin, I've created a Bootstrap version which is very similar in use but uses Bootstrap's Modal Popup to embed the YouTube Player. This plugin will need the complete Bootstrap library or just the Modal component to run this plugin.

Use the link below to view a demo or read the documentation on how to include this on your page. You can download the latest version of this plugin’s library from Github.

 Demo and Documentation: http://lab.abhinayrathore.com/bootstrap-youtube/

 Github: https://github.com/abhinayrathore/Bootstrap-Youtube-Popup-Player-Plugin

jQuery Cheatsheet

The last and always up-to-date version of jQuery API Cheatsheet you’ll ever need. I use web-scraping to get the latest version of jQuery and then load the API information into a nicely printable cheat-sheet.

http://lab.abhinayrathore.com/jquery-cheatsheet/