Skip to main content

Smaller is Better

You often hear the phrase "bigger is better". Sometimes it's true but not when it comes to JavaScript or CSS code in your Yahoo! Store pages. If you include JavaScript code or CSS either as linked files (the preferred method) or embedded inside your pages (obviously not preferred), making these files as small as possible should be your goal. Why? This is no rocket science: smaller files mean faster page loads = happy customers.

Ok, so what bloats JavaScript code? In general, white space (tabs, carriage returns, non-used spaces), comments, and the actual code, such as variable and function names.

You have control over all of these, however, if you don't use white spaces, carriage returns or comments, it will be immensely difficult to understand and modify your code. And not just for others, you too.

There are many commercial JavaScript compression tools around, but I've been using this handy and free utility: http://www.andrewkesper.com/jscrush/

This little utility can take any number of JavaScript files and automatically remove white spaces and comments from those files resulting in files considerably smaller in size than the originals. There are a couple of other advantages of this tool:

1. You can use it to compress CSS files as well, not just JavaScript files.
2. You can have it combine your source JavaScript files into a single, compressed file.

Happy compressing!

Comments

Anonymous said…
This is a pretty cool tool. I will use it to condense my files.

Popular posts from this blog

Pre-Season Checkup

With the holiday shopping season fast approaching it's a good idea to do a general checkup on your store to be sure it's ready for prime time. Below are a few things you would want to check, along with a few add-ons that are not too major in scope, but which are often neglected and give you an edge over your competition. Can you Search and Order? Every time we do anything major in a store we test two things: whether searching and adding to cart/ordering works. You can have nice, flashy pictures, cool animation effects, a very quick loading site, anything, but if the store search is broken or you can't add to the cart or can't check out then an ecommerce site is worth nothing. Can you Order? Chances are if your checkout was completely broken you'd know about it by now, but it doesn't have to be totally broken in order to scare away potential customers. So go ahead, go to your site and first do a search and make sure it works. Then, add one or more products

Really Quick Trick to Improve Page Load Speed of a Yahoo Store a Little Bit

With Google getting more and more aggressive about wanting web sites to be quick to load (particularly on mobile), we often find ourselves trying to find even the smallest of tweaks to nudge up that page speed score even if by a tiny bit. Here is a quick trick you can do completely on your own, without having to ask a developer, that will probably bump up your Google PageSpeed score by a couple of points. First a short disclaimer: this trick is only applicable if you have enabled the Yahoo! Badge in your Store Manager, under Live Insights & App Gallery. Before you start, you may want to check your site's Google PageSpeed (the home page is a good place to start) both as a benchmark, and also to get a glimpse at how fast (or slow) Google believes your site (or home page) is. Here is the link: https://developers.google.com/speed/pagespeed/insights/ Ok, so if you did enable the Yahoo! Badge, your site includes a small Yahoo Live Store badge, much like this: When you h

How to create clean and efficient CSS

In a typical workday, I deal with dozens of yahoo stores and very often I have to tweak, fix, or change CSS used by these stores. While some stores have very clean and easy to follow style sheets or CSS definitions, the vast majority of stores I've seen seem to include complete hack jobs, style sheets put together completely haphazardly, or as an afterthought. While working in such a store, the idea came to me to turn my gripes into a post. So the following is my list of dos and don'ts of good CSS or style design. 1. Externalize your style sheets. This means to save your style sheets into one or more css files, and link to them using the <link rel="stylesheet" type="text/css" href="/lib/yourstoreid/yourstyle.css"> notation, or in Editor V3.0, you can use the LINK operator. 2. Combine your style sheets into as few files as possible. Nothing worse than trying to wade through 6, 8, 10 or more different style sheets to find the color of a