Tag Archives: javascript

Protoaculous 1.9.0-1.7.2.0 Minified

November 15, 2014 Inder Leave a comment

What
This is an update to a post from 2011: Protoaculous 1.9.0 Minified. In the older post, I published Protoaculous 1.9.0 which was based on Scriptaculous 1.9.0 and PrototypeJS 1.7.0.

Updates

A newer version of PrototypeJS is out: 1.7.2. So I’ve updated Protoaculous to use the newer version.
Switched away from YUI Compressor to Google Closure Compiler since it produces more compressed files.
I was previously using Scriptaculous version number as Protoaculous’ version number. This type of versioning is flawed because it doesn’t work when only PrototypeJS gets updated. So I’m now using Scriptaculous_version-Prototype_version.
I’ve published the script I use to create new versions of Protoaculous on Github: Protoaculous Bundler.

Direct links

https://raw.githubusercontent.com/inderpreet99/protoaculous-bundler/master/dist/protoaculous.1.9.0-1.7.2.0.js
https://raw.githubusercontent.com/inderpreet99/protoaculous-bundler/master/dist/protoaculous.1.9.0-1.7.2.0.min.js

Warnings
I have not tested how well the combination of the two scripts perform. Please use caution and testing before using it in a production environment. Although previous versions have performed well.

Issues
While generating protoaculous using Google Closure Compiler, I noticed the following issues, which should probably be fixed by the PrototypeJS team:

Generate protoaculous.1.9.0-1.7.2.0.js and protoaculous.1.9.0-1.7.2.0.min.js in dist...
dist\protoaculous.1.9.0-1.7.2.0.js:4619: WARNING - Suspicious code. The result of the 'getprop' operator is not being used.
  arr[ preferredDoc.childNodes.length ].nodeType;
  ^
dist\protoaculous.1.9.0-1.7.2.0.js:5602: WARNING - Suspicious code. This code lacks side-effects. Is there a bug?
  if ( elem.parentNode ) {
  ^
dist\protoaculous.1.9.0-1.7.2.0.js:5603: WARNING - Suspicious code. The result of the 'getprop' operator is not being used.
  elem.parentNode.selectedIndex;
  ^
0 error(s), 3 warning(s)

Size information

Size of Prototype.js + Scriptaculous = 314K
Size of Protoaculous.js Minified = 166K

Suggestions

I would suggest:

Turning on gzip functionality (mod_deflate on Apache) for all html and js/css/etc assets in your webserver to get filesizes even lower. This would ensure your users get the files even faster.
Adding very long expiration dates (like years) through your webserver on js/css/etc assets. This would ensure your users do not have to download the files again and again. Since the files are versioned, there should not be a problem in cache busting on newer updates.

Downloads

Protoaculous 1.9.0 Minified

March 21, 2011 Inder 5 Comments

Premise
I used to download the updated versions of protoaculous from Prototype Core Google Group. Recently, Google announced that the Files section of the Google Groups will be deprecated. Also, nobody has been updating the copy of protoaculous in that group (or anywhere else on the public google-searched internet for that matter).

Instructions
The instructions to create it are really simple and so you can do it yourself. You can read them at Boog Design.

Download
For the lazy (like me), here’s the minified version of Prototype.js 1.7.0 (using the new Sizzle CSS Selector Engine – v1.0) + Scriptaculous 1.9.0:
Download

Coral CDN
Cached version (similar to ajax.googleapis.com versions):
http://inderpreetsingh.com.nyud.net/wp-content/uploads/protoaculous.1.9.0.min_.js

Other info
Size of Prototype.js + Scriptaculous = 287,939 bytes
Size of Protoaculous.js Minified = 168,754 bytes

Packed: prototype.js + scriptaculous.js + builder.js + effects.js + dragdrop.js + controls.js + slider.js + sound.js

Programming

Chrome’s javascript sort array function is different, yet proper

December 1, 2010 Inder 1 Comment

Chrome’s javascript sort function behaves more like the ECMA standards than the sort function implemented in other browsers (like Firefox, IE, etc), which try to maintain some backwards compatibility with legacy javascript code.

Generally, when sorting an array, I’ve always found the following (incorrect) code:

result.sort(function(a,b) { return a > b } );

According to the ECMA standards, the right way to do it is not to return true or false, like the above function, but to return -1, 0, or 1, depending on how the two strings compare, like the following:

function sortfn (a,b) {
	var upA = a.toUpperCase();
	var upB = b.toUpperCase();
	return (upA < upB) ? -1 : (upA > upB) ? 1 : 0;
}

Helpful Tips

Javascript/JSON: Find Index in an Array of Objects

October 14, 2010 Inder Leave a comment

JSON is one of my favorite data models notation (xml = :(). A lot of times, I get arrays of objects (hash tables) that I then have to search again an again to find the index of the object inside that array. Here’s a quick function to find it:


/*
function findIndexByKeyValue: finds "key" key inside "ob" object that equals "value" value
example: findIndexByKeyValue(students, 'name', "Jim");
object: students = [
   {name: 'John', age: 100, profession: 'Programmer'},
   {name: 'Jim', age: 50, profession: 'Carpenter'}
];
would find the index of "Jim" and return 1
*/

function findIndexByKeyValue(obj, key, value)
{
	for (var i = 0; i < obj.length; i++) {
		if (obj[i][key] == value) {
			return i;
		}
	}
	return null;
}

Programming

Avoid for (var x in array) when using jQuery/PrototypeJS

September 13, 2010 Inder Leave a comment

I was looking to make my code look more readable by “cleverly” using for (var x in array) loops instead of for (var x=0; x < array.length; x++), even though the shorter for loops are not supposed to be used with arrays, but used only with objects.

Turns out that jquery/prototypeJS put in extra hidden variables inside the array. If for whatever reason you are not using a JavaScript framework/library, you can use cross-browser shortcut: for (var x in array). However, be cautioned JavaScript experts are particularly annoyed by it.

Inderpreet Singh