Which Web Tools – When and How Much

I cannot say enough about learning which tools use when. It is only through experience will you ever learn this discipline. I have learned when to use a handful of tools and how often. I have also learned that sometimes there is overhead that can make your projects bloated; therefore, I often create my own ( although some may argue against it).

First thing to learn is to never use hosted libraries and CSS files. Always download a copy and run it as part of your project. Hosted libraries, CSS, fonts and graphics can give you unexpected results. Example; the hosted resource may change and break your project or change how it looks. The hosted library can go down and cause undesired effects or even take your site offline. You think you would be safe if you use a hosted library from someone like Google, but you would be wrong. Last year I had multiple sites behave slowly and even crash due to not able to communicate with Google for which was down for about an hour. If you cannot download the resource, library, CSS, fonts and/or graphics; create your own solution.

One example is in my earlier blog; I make use of the jQuery.UI’s dialog box. I use this for the quick and dirty projects where I need a elegant solution, yet I have limited time. With the jQuery.UI there is CSS files, another jQuery library and graphics. Given the time, I often make my own little dialog box that piggy backs on my existing css and fonts. Very little overhead, small foot print, but a little more work ( not much more though ). Do it yourself, you have ultimately control of look and function. Create a library of your routines so that you can use them as easily as you would if you were just downloading an already built library from someone else. For the purpose of work, I do not use the jQuery.UI dialog box, I do a home brew for a consistent look.

I love AngularJS, but I have discovered that AngularJS can often be elegant and nice looking. AngularJS is fast and easy to implement. I particular like n-Table for its easy sorting and paging functions. A word of caution though, if you use too much AngualrJS it can make the user experience a bit chuggy…. Thast is right I used the word chuggy ( I know chuggy is not word ) to best describe the experience of using too much AngularJS.

SignalR is a Microsoft interface. I love this for instant messaging between two users on the same web application. When I say instant message, I do not necessary mean chat; although you could write a simple chat module in matter of hours instead of days, weeks or months. SignalR will take a message or event and broadcasts to a particular user, group of users or all the users of the web application. It is brilliant, light weight and easy. Particularly good if you have two users viewing and editing documents. You can change their experience or at very least notify the users of changes without any delay. Again – Do not over use; too many communications hubs could kill the value of the notification or worse yet make things a tad slower to load.

Sometimes people like to use jQuery to change functionality or look of the a standard HTML element. I prefer not to have jQuery change the look in particular. jQuery can cause an element to change to look pretty, but sometimes if you have a lot happening it may make the element design render after the page is loaded. The user never should see a textbox or select element or any other element transform. If the user can see the change, you need to change. Perhaps you are binding the elements too late. Sometimes you have no choice and you need to come up with another way of displaying things. I sometimes will start the interface hidden and fade it in quickly and the user ultimately sees a nice clean interface from the beginning of their experience. There is a lot of tricks here and you need to use the right one at the right time. Not all trickery will fix every issue all the time. Ultimately if you need to change the way something looks, try your best to do it in CSS. The modern CSS can do a lot more than before and is supported by browsers that were created in the last two years.

There is more to learn, but we are closing on 800 words and I think it is time to rest.

Andrew Pallant (@LdnDeveloper) has been a web, database and desktop developer for over 16 years. Andrew has worked on projects that ranged from factory automation to writing business applications. Most recently he has been heavily involved in various forms for ecommerce projects. Over the years Andrew has worn many hats: Project Manager, IT Manager, Lead Developer, Supervisor of Developers and many more - See more at: http://www.unlatched.com/#sthash.8DiTkpKy.dpuf

Posted in AngularJS, Design, Developement, jQuery, Personal Thoughts, Professional Development, Web