<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/atom10full.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><feed xmlns="http://www.w3.org/2005/Atom" xmlns:thr="http://purl.org/syndication/thread/1.0" xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" xml:lang="en" xml:base="http://jacwright.com/blog/wp-atom.php">
	<title type="text">Jacob Wright - Flex, AIR, PHP, etc.</title>
	<subtitle type="text">Flex, AIR, PHP, etc.</subtitle>

	<updated>2011-04-03T21:10:18Z</updated>

	<link rel="alternate" type="text/html" href="http://jacwright.com/blog" />
	<id>http://jacwright.com/blog/feed/atom/</id>
	

	<generator uri="http://wordpress.org/" version="3.1.2">WordPress</generator>
		<atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" type="application/atom+xml" href="http://feeds.feedburner.com/jacwright" /><feedburner:info uri="jacwright" /><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com/" /><entry>
		<author>
			<name>Jacob Wright</name>
						<uri>http://www.jacwright.com</uri>
					</author>
		<title type="html"><![CDATA[Sharing my Class class.]]></title>
		<link rel="alternate" type="text/html" href="http://feedproxy.google.com/~r/jacwright/~3/JC6girVjaVU/" />
		<id>http://jacwright.com/blog/?p=562</id>
		<updated>2011-04-03T21:10:18Z</updated>
		<published>2011-04-03T21:10:05Z</published>
		<category scheme="http://jacwright.com/blog" term="Javascript" />		<summary type="html"><![CDATA[I&#8217;ve been using a little class utility to create classes for awhile and thought I&#8217;d share it and discuss what I did and why. First the goals, then code, then examples and discussion. Goals When I created this I basically wanted something that looked like a class instead of a function I was extending (I [...]]]></summary>
		<content type="html" xml:base="http://jacwright.com/blog/562/sharing-my-class-class/">&lt;p&gt;I&amp;#8217;ve been using a little class utility to create classes for awhile and thought I&amp;#8217;d share it and discuss what I did and why. First the goals, then code, then examples and discussion.&lt;/p&gt;
&lt;h3&gt;Goals&lt;/h3&gt;
&lt;p&gt;When I created this I basically wanted something that looked like a class instead of a function I was extending (I know, non-javascripty, but ecmascripty in laster versions), but that was still 100% native Javascript inheritance.&lt;br /&gt;
Looks like a class from other more OO languages&lt;br /&gt;
Uses native JS prototype inheritance so &amp;#8220;myobj instanceof MyClass&amp;#8221; still works.&lt;br /&gt;
Small, uncomplicated, don&amp;#8217;t want tons of hacks and work-arounds.&lt;/p&gt;
&lt;h3&gt;Code&lt;/h3&gt;
&lt;p&gt;The most updated code can be found on github and requires the compat.js file in the same repository needs to be included for cross-browser compatibility if using in the browser: https://github.com/jacwright/jslib/blob/master/class.js&lt;/p&gt;
&lt;h3&gt;Examples and Discussion&lt;/h3&gt;
&lt;p&gt;To create a new class you new up an instance of Class like this:&lt;/p&gt;
&lt;pre&gt;var Person = new Class({
    constructor: function(name) {
        this.setName(name);
    },
    setName: function(value) {
        this.name = value || 'unknown';
    }
});
console.log(Person);&lt;/pre&gt;
&lt;p&gt;When you output the Person class you&amp;#8217;ll see that it is actually just the constructor function. If you were to create this same Person class with regular Javascript you would get the exact same end result.&lt;/p&gt;
&lt;pre&gt;var Employee = new Class({
    extend: Person,
    constructor: function(name, title) {
        Person.call(this, name); // call the super-class constructor
        this.title = title;
    },
    setName: function(value) {
        if (!value) throw new Error('Employees must have a name.');
        Person.prototype.setName.call(this, value); // call super setName
    }
});
var jacob = new Employee('Jacob Wright', 'UI Guy');
console.log('Is employee?', jacob instanceof Employee);
console.log('Is person?', jacob instanceof Person);&lt;/pre&gt;
&lt;p&gt;Creating a sub-class is really easy. You use the word &amp;#8220;extend&amp;#8221; (not &amp;#8220;extends&amp;#8221; because that is a keyword in javscript/ecmascript) and assign it the class you&amp;#8217;re extending. It uses javascript prototype extension under the hood. You end up with the exact same thing you would not using the Class class. You see I still call the super class constructor and methods the same as I would in normal Javascript. If you have the class in its own closure you could define a property &amp;#8220;var parent = Person.prototype;&amp;#8221; before the class and then change your calls to the super class to &amp;#8220;parent.setName.call(this, value)&amp;#8221; if you are so inclined.&lt;/p&gt;
&lt;p&gt;You can also pass in &amp;#8220;implement&amp;#8221; and the methods on that class (or classes as you can also give it an array of classes) will get copied over to the prototype of this one. It is not actual inheritance so &amp;#8220;instanceof&amp;#8221; will not return true, and I don&amp;#8217;t have any methods to ask if a class implements another, though that might be useful.&lt;/p&gt;
&lt;p&gt;Statics are easy as well.&lt;/p&gt;
&lt;pre&gt;var Developer = new Class({
    extend: Employee
}, { // 2nd parameter is the static definition
    devs: {},
    factory: function(name) {
        if (this.devs.hasOwnProperty(name)) return this.devs[name];
        return this.devs[name] = new Developer(name, 'Developer');
    }
});
var jacob = Developer.factory('Jacob Wright');&lt;/pre&gt;
&lt;h3&gt;Working Parts&lt;/h3&gt;
&lt;p&gt;Things I like about how it is implemented:&lt;br /&gt;
I thought it was stupidly clever to actually call the constructor &amp;#8220;constructor&amp;#8221; instead of &amp;#8220;init&amp;#8221; or &amp;#8220;initialize&amp;#8221; or whatever else other class helpers do. I don&amp;#8217;t even have to remove it from the prototype since native prototypes define the constructor on them anyway. I only remove extend and implement from the prototype (though maybe I don&amp;#8217;t even need to do that).&lt;/p&gt;
&lt;p&gt;The empty constructor. You&amp;#8217;ll see in the code there is an EmptyClass function. I use this in the prototype inheritance by assigning the prototype of the extended class to that of EmptyClass. Then I can create &amp;#8220;new EmptyClass()&amp;#8221; for the prototype chain and accomplish the same thing without running constructor code on the prototype object. This keeps the constructor of the parent class from getting called until you actually create a new instance of the class.&lt;br /&gt;
UPDATE: Using Object.create() does the same thing as using the empty constructor trick and I use that now to stick to standards.&lt;/p&gt;
&lt;p&gt;Returning from a constructor. When a function returns a value and you attempt to create an object with the &amp;#8220;new&amp;#8221; operator, you actuall get back the returned value instead of a new class instance. If I were to return the number 42 from the Class function then &amp;#8220;var num = new Class()&amp;#8221; would give me 42 for num. You can see from the code that the Class constructor returns the impl.constructor. This is an interesting feature of Javascript and allows me to give back the constructor passed in the impl object (i.e. the prototype object) to the caller after I&amp;#8217;ve set up its extend and implement parts.&lt;/p&gt;
&lt;h3&gt;Credits&lt;/h3&gt;
&lt;p&gt;Whether this is something useful or not I hope it is an interesting approach to the problem of OO and has helped you learn something new. I picked up the &amp;#8220;empty constructor&amp;#8221; trick from Prototype, the general idea of using &amp;#8220;new Class&amp;#8221; from MooTools, some of the implementation from ExtJS and the others, and then just simplified down as much as possible.&lt;/p&gt;
&lt;img src="http://feeds.feedburner.com/~r/jacwright/~4/JC6girVjaVU" height="1" width="1"/&gt;</content>
		<link rel="replies" type="text/html" href="http://jacwright.com/blog/562/sharing-my-class-class/#comments" thr:count="2" />
		<link rel="replies" type="application/atom+xml" href="http://jacwright.com/blog/562/sharing-my-class-class/feed/atom/" thr:count="2" />
		<thr:total>2</thr:total>
	<feedburner:origLink>http://jacwright.com/blog/562/sharing-my-class-class/</feedburner:origLink></entry>
		<entry>
		<author>
			<name>Jacob Wright</name>
						<uri>http://www.jacwright.com</uri>
					</author>
		<title type="html"><![CDATA[Client-side-only Javascript Amazon S3 CMS]]></title>
		<link rel="alternate" type="text/html" href="http://feedproxy.google.com/~r/jacwright/~3/WuQWtaJLpE4/" />
		<id>http://jacwright.com/blog/?p=556</id>
		<updated>2011-03-07T14:51:30Z</updated>
		<published>2011-03-07T14:00:00Z</published>
		<category scheme="http://jacwright.com/blog" term="Applications" /><category scheme="http://jacwright.com/blog" term="Javascript" />		<summary type="html"><![CDATA[Amazon S3 just released a feature that allows you to host a website on S3. I&#8217;ve been wanting this feature for years and now that it&#8217;s here I can&#8217;t keep my mind off of building a CMS on top of it. There&#8217;s just so many interesting challenges to figure out and technical coolness. Javascript Client [...]]]></summary>
		<content type="html" xml:base="http://jacwright.com/blog/556/client-side-only-javascript-amazon-s3-cms/">&lt;p&gt;Amazon S3 just released a feature that allows you to host a &lt;a href="http://aws.amazon.com/about-aws/whats-new/2011/02/17/Amazon-S3-Website-Features/"&gt;website on S3&lt;/a&gt;. I&amp;#8217;ve been wanting this feature for years and now that it&amp;#8217;s here I can&amp;#8217;t keep my mind off of building a CMS on top of it. There&amp;#8217;s just so many interesting challenges to figure out and technical coolness.&lt;/p&gt;
&lt;h2&gt;Javascript Client&lt;/h2&gt;
&lt;p&gt;The idea is to build a CMS that is 100% HTML and Javascript, hosted from S3 itself. You would upload the initial files for the admin, set an appropriate bucket policy, and set up the website features on your bucket (or more likely when I&amp;#8217;m further along put your Amazon creds into an online upload form and allow a little web service to do it for you). Then you would navigate to https://yourbucket.s3.amazonaws.com/admin/index.html and login to your hosted javascript admin. Logging would keep the key and secret in memory and you&amp;#8217;d be able to add, delete, update, and otherwise work with your website on S3, from S3.&lt;/p&gt;
&lt;h3&gt;Benefits of Client-side Javascript and S3&lt;/h3&gt;
&lt;p&gt;There are some really cool aspects to a 100% client-side Javascript application and hosting on S3.&lt;/p&gt;
&lt;p&gt;The biggest IMO probably being pluginability. Most people can write Javascript and many know jQuery, so writing plugins that utilized both to extend the interface, respond to actions, and otherwise modify the system would be easy and allow for very customized web admins and sites. You also have a built-in REST API that you can store anything to. If you want to add TODOs to the cms, you can store them in /api/todos/ immediately without having to create a new database table and worry about setup. You can also update your TODO plugin later to include priority without needing to update tables.&lt;/p&gt;
&lt;p&gt;There is also the draw of high-traffic websites not hitting any servers you have to worry about. Let Amazon deal with the hosting and meet their &amp;#8220;99.99% availability&amp;#8221;. You can handle massive load. And it&amp;#8217;s cost-effective. And stable/redundant, you don&amp;#8217;t need backups. And you can front the whole thing with CloudFront to deliver your pages at the closest locations possible (you&amp;#8217;ll have to invalidate pages that get updated though).&lt;/p&gt;
&lt;h3&gt;Drawbacks&lt;/h3&gt;
&lt;p&gt;It&amp;#8217;s hard to have dynamic websites without server-side logic. You can&amp;#8217;t accept comments on your posts. You can&amp;#8217;t resize images on the fly or even at upload time (well, with canvas, but that&amp;#8217;s something to research more on viability). You can&amp;#8217;t send out emails. And you can&amp;#8217;t utilize cross-site resources or APIs (such as CloudFront or Akismet). However, if this cms turns out well and people use it, I can create a service that will allow all of these things for registered users.&lt;/p&gt;
&lt;h3&gt;Previous Work&lt;/h3&gt;
&lt;p&gt;When looking around for an S3 Javascript client I found that back as far as 2006 &lt;a href="http://decafbad.com/blog/2006/04/03/javascript-apps-with-readwrite-access-to-s3"&gt;people&lt;/a&gt; were thinking about building &lt;a href="http://ajaxian.com/archives/s3-javascript-bindings"&gt;Javascript applications hosted from S3&lt;/a&gt;. It didn&amp;#8217;t really seem to take off, but there&amp;#8217;s a lot more work that&amp;#8217;s been done on S3 since then. It might be more interesting now. Especially if some general hurdles are figured out so that your site isn&amp;#8217;t hacked, spammed, and ruined.&lt;/p&gt;
&lt;h2&gt;Security&lt;/h2&gt;
&lt;p&gt;My first and biggest concern for something like this is handling security. How does one have an all client-side application and still allow secure login and user management? The first thing that comes to mind is the obvious: why not have the user enter their Amazon key and secret to login? That&amp;#8217;s a good idea. At least, it will work. Using a the bucket policy file we can specify an area of the site that is private for reads and writes which can store website data (all of it will be private for writes). But if this is going to be something I use, I don&amp;#8217;t want to go look up my amazon key and secret every time I need to log in. So I brainstormed other solutions.&lt;/p&gt;
&lt;h3&gt;AES&lt;/h3&gt;
&lt;p&gt;I need 2-way encryption that will allow me to store the amazon key and secret in a public location. Public because you can&amp;#8217;t access it before you&amp;#8217;re logged in now can you. The most secure 2-way encryption I found was &lt;a href="http://en.wikipedia.org/wiki/Advanced_Encryption_Standard"&gt;AES&lt;/a&gt; which is used in government and many other places. It is quite secure and wonderfully &lt;a href="http://www.movable-type.co.uk/"&gt;Movable Type&lt;/a&gt; has implementations of &lt;a href="http://www.movable-type.co.uk/scripts/aes.html"&gt;AES&lt;/a&gt; and &lt;a href="http://www.movable-type.co.uk/scripts/sha1.html"&gt;SHA1&lt;/a&gt; and lots of other stuff in Javascript.&lt;/p&gt;
&lt;p&gt;A user will register with a username (or email), password, amazon key, and amazon secret. The password will be used to encrypt a string of &amp;#8220;username:key:secret&amp;#8221; and saved to a public file by the sha1 of the username under the private folder api/auth/. Having the folder private will prevent people from seeing what is in it. You&amp;#8217;d have to guess the sha1 to even get the file, and then you&amp;#8217;d have to know the password to decrypt it. After registering, a user can login with their username and password. The username will be sha1&amp;#8242;ed and the user file will be loaded (if it exists). Then the password will be used for deciphering the contained hash and the key and secret put safely away inside a Javascript closure in memory.&lt;/p&gt;
&lt;p&gt;This seems quite secure. For one, the username and password never even go over the wire, so even if we weren&amp;#8217;t going to use SSL (which we are) the only thing a man-in-the-middle would see is the encrypted AES hash. If anyone has better ideas or sees holes in this I&amp;#8217;d love to fix it up more securely.&lt;/p&gt;
&lt;h2&gt;Features&lt;/h2&gt;
&lt;p&gt;My other main concern is whether one could really support many features of a common web cms with only client-side logic. I&amp;#8217;ve been quite surprised at how many features I&amp;#8217;ve thought could work with simple Javascript. Here is a list of those I&amp;#8217;ve thought of so far:&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Templates&lt;/strong&gt;: pages, content, templates, etc. could be stored in the api and whenever you update a page, jQuery can put the content into the template and save the whole file out to its location. Templating would be similar to other systems except that when you change the theme or update the template it will have to re-process each file that uses the template individually.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Plugins&lt;/strong&gt;: plugins would work by attaching onto hooks or listeners throughout the system or adding new editable-field types. They could add HTML to the admin to include new buttons or menus. And their javascript could be concatenated and minified into one plugin file that gets loaded at runtime whenever you activate a new plugin, then you have one small file to load when you log in.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;File upload&lt;/strong&gt;: it turns out you can sign a form a certain way in order to upload files to S3. This is great since you can&amp;#8217;t load (in all browsers) files into Javascript first and then sign them and put them to S3. So lage images, video files, etc. can be done without passing through Javascript.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Blog support&lt;/strong&gt;: you can easily do a blog by recompiling the home-page template whenever you publish a new post. You could even recompile an RSS feed client-side and put that to S3 at the same time.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Shared content&lt;/strong&gt;: menus, footer content, and other shared content could work, just like when editing a template. Any page that piece of content is shown on will need to be recompiled, however this could easily happen in the background with a little progress indicator while you continue editing or modifying your website. If you try and close up shop before it is finished the admin can warn you that leaving the page will leave your site partially undone.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Additional users&lt;/strong&gt;: you could either 1. give access to another user&amp;#8217;s amazon account to edit your site and let them register using their amazon key/secret, or 2. you could add more users with username/password using your amazon key/secret which will create their &amp;#8220;auth file&amp;#8221; using those creds. They would never need to touch your key/secret, although they could find it out, so don&amp;#8217;t use this method with people you don&amp;#8217;t trust.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Remember me&lt;/strong&gt;: you could store username/password in a cookie for &amp;#8220;remember me&amp;#8221; functionality. If you do this then maybe using the sha1 of the password to encrypt the AES cypher and storing the sha1 password in the cookie would be a better idea. Keep that thing as safe as possible. Though unsafe plugins could take either version out of the cookie and use it to obtain your key/secret. Maybe use a separate path for login since cookies can restrict on path? Something to think through more.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Code highlighting&lt;/strong&gt;: code or syntax highlighting can be done at save-time using the Google Code Prettifier project or another Javascript-based project of similar sort. It would just be a plugin.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Content&lt;/strong&gt;: you can have all the same content other CMSes allow: html, js, css, flash, images, galleries, xml, etc. E.g. use a Javascript plugin to create the XML that your Flash photo gallery needs to run.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Versioning&lt;/strong&gt;: you can use S3&amp;#8242;s built-in versioning to keep every version of an object saved to the bucket and revert back to an old version if desired, or undo a delete.&lt;/p&gt;
&lt;h2&gt;Open Source&lt;/h2&gt;
&lt;p&gt;This is something crying out for open source. It has been really fun to start and should be really fun to continue working on. I&amp;#8217;ve put the beginnings up on github calling it &lt;a href="https://github.com/jacwright/StaticSite"&gt;Static Site&lt;/a&gt;, since it is hosted on S3. Should I call it S2? :) I also have &lt;a href="http://staticsite.org/"&gt;staticsite.org&lt;/a&gt; hosted from my own S3 bucket which will be using the CMS as it comes along. I hope to steal a moment here and there from my busy work schedule when I need a break in the evenings to keep working on it.&lt;/p&gt;
&lt;p&gt;What do you think? Would you use it?&lt;/p&gt;
&lt;img src="http://feeds.feedburner.com/~r/jacwright/~4/WuQWtaJLpE4" height="1" width="1"/&gt;</content>
		<link rel="replies" type="text/html" href="http://jacwright.com/blog/556/client-side-only-javascript-amazon-s3-cms/#comments" thr:count="6" />
		<link rel="replies" type="application/atom+xml" href="http://jacwright.com/blog/556/client-side-only-javascript-amazon-s3-cms/feed/atom/" thr:count="6" />
		<thr:total>6</thr:total>
	<feedburner:origLink>http://jacwright.com/blog/556/client-side-only-javascript-amazon-s3-cms/</feedburner:origLink></entry>
		<entry>
		<author>
			<name>Jacob Wright</name>
						<uri>http://www.jacwright.com</uri>
					</author>
		<title type="html"><![CDATA[Into the swing of Javascript]]></title>
		<link rel="alternate" type="text/html" href="http://feedproxy.google.com/~r/jacwright/~3/xVBgs0h8SDE/" />
		<id>http://jacwright.com/blog/?p=501</id>
		<updated>2011-02-22T03:18:25Z</updated>
		<published>2011-02-14T15:00:49Z</published>
		<category scheme="http://jacwright.com/blog" term="General" />		<summary type="html"><![CDATA[My last post was a long time ago. I&#8217;ve been busy. Unfortunately rather than being some interesting article occupying the top spot on my site it has been a short bemoan of missing Flash. I still miss ActionScript 3 from time to time, but I&#8217;ve really been enjoying Javascript development, both in the client and [...]]]></summary>
		<content type="html" xml:base="http://jacwright.com/blog/501/into-the-swing-of-javascript/">&lt;p&gt;My last post was a long time ago. I&amp;#8217;ve been busy. Unfortunately rather than being some interesting article occupying the top spot on my site it has been a short bemoan of missing Flash. I still miss ActionScript 3 from time to time, but I&amp;#8217;ve really been enjoying Javascript development, both in the client and on the server. There have been a couple things that have made it more manageable to me. I want to share.&lt;/p&gt;
&lt;h2&gt;Multiple Files&lt;/h2&gt;
&lt;p&gt;One of the hardest parts of heavy Javascript starting out was fitting everything into a few files. Being used to a-class-per-file with ActionScript has made cramming a whole application into two or three files quite unorganized, no matter how commented the code. I know combining Javascript files isn&amp;#8217;t a big deal, but what really made it work for me is when I integrated it into my IDE workflow (I use &lt;a href="http://www.jetbrains.com/idea/"&gt;IntellJ&lt;/a&gt; which has the best Javascript intelligence I&amp;#8217;ve found in any IDE—&lt;a href="http://www.jetbrains.com/webstorm/"&gt;WebStorm&lt;/a&gt; would be the same, without as much bloat). I have a maven script that uses &lt;a href="http://developer.yahoo.com/yui/compressor/"&gt;YUI Compressor&lt;/a&gt; (could use Ant easily as well) and it is set up to my Cmd+S key-binding so whenever I save a Javascript file it saves the file and recombines the rest into one file. A downside is that I have to be cognizant of what order (dependency-wise) the files go in and to be sure to add them to my maven script as I add new files. I&amp;#8217;d like to look at Google&amp;#8217;s Closure compiler which allows the use of a require() method to include scripts and figures out dependency for you when putting them together. This would be nice.&lt;/p&gt;
&lt;h2&gt;Realistic Classes&lt;/h2&gt;
&lt;p&gt;Getting a simple Class utility put together that makes creating classes more readable but still uses does it &amp;#8220;the native way&amp;#8221; under the hood has made class structures enjoyable. I use a modification of my &lt;a href="https://github.com/jacwright/simpli5/blob/master/src/class.js"&gt;simpli5 class utility&lt;/a&gt; (I don&amp;#8217;t use the rest of simpli5 much however since we&amp;#8217;re still not completely HTML5 yet). Consider the difference between the following:&lt;/p&gt;
&lt;pre&gt;
function MyClass(state) {
    this.state = state;
}
MyClass.prototype.doSomething = function() {
    this.state = this.state + 42;
};
// versus
var MyClass = new Class({
    constructor: function(state) {
        this.state = state;
    },
    doSomething: function() {
        this.state = this.state + 42;
    }
});
&lt;/pre&gt;
&lt;p&gt;I think it is much more readable.&lt;/p&gt;
&lt;h2&gt;Packages&lt;/h2&gt;
&lt;p&gt;I also use a form of package management, and I wrap all my files in function closures so I don&amp;#8217;t clutter the global scope. But I hate always referencing Classes or package-level object and methods with their full package name, so I use imports&amp;#8230;sorta.&lt;/p&gt;
&lt;pre&gt;
(function() {
    // imports
    var Class = mypackage.Class,
        OtherNeededClassOrObject = mypackage.somepackage.ClassOrObject,
        subpackage = mypackage.subpackage,
        MySuperClass =subpackage.MySuperClass;

    subpackage.MyClass = new Class({
        extend: MySuperClass,
        constructor: function() {
            MySuperClass.call(this); // super(); in Flash
        }
    }, {
        /*statics*/
    });
})();
&lt;/pre&gt;
&lt;p&gt;I&amp;#8217;m quite happy with the setup I&amp;#8217;ve established, using separate files, classes, and package management. It keeps it close to how Javascript works without any &amp;#8220;magic&amp;#8221; or hacks, and it makes my code much more readable and manageable to me. I&amp;#8217;ve also borrowed a few ideas from &lt;a href="http://documentcloud.github.com/backbone/"&gt;backbone.js&lt;/a&gt; for a base Model class that will load data from my APIs. I didn&amp;#8217;t need the rest of backbone for this project so just used their ideas, but in future projects I would consider it.&lt;/p&gt;
&lt;p&gt;Happy coding!&lt;/p&gt;
&lt;img src="http://feeds.feedburner.com/~r/jacwright/~4/xVBgs0h8SDE" height="1" width="1"/&gt;</content>
		<link rel="replies" type="text/html" href="http://jacwright.com/blog/501/into-the-swing-of-javascript/#comments" thr:count="0" />
		<link rel="replies" type="application/atom+xml" href="http://jacwright.com/blog/501/into-the-swing-of-javascript/feed/atom/" thr:count="0" />
		<thr:total>0</thr:total>
	<feedburner:origLink>http://jacwright.com/blog/501/into-the-swing-of-javascript/</feedburner:origLink></entry>
		<entry>
		<author>
			<name>Jacob Wright</name>
						<uri>http://www.jacwright.com</uri>
					</author>
		<title type="html"><![CDATA[I miss Flash]]></title>
		<link rel="alternate" type="text/html" href="http://feedproxy.google.com/~r/jacwright/~3/b8yuKMzr43M/" />
		<id>http://jacwright.com/blog/?p=495</id>
		<updated>2010-09-25T03:46:32Z</updated>
		<published>2010-09-25T03:46:32Z</published>
		<category scheme="http://jacwright.com/blog" term="General" />		<summary type="html"><![CDATA[Javascript can be fun, but I miss Flash. I miss having packages. I miss having private, protected, and public variables. I miss having getters and setters. I miss the organization of a Flash project. Javascript is so messy, even when it&#8217;s done well. Mostly, I miss the Flash community. Don&#8217;t worry duders, I&#8217;ll be back.]]></summary>
		<content type="html" xml:base="http://jacwright.com/blog/495/i-miss-flash/">&lt;p&gt;Javascript can be fun, but I miss Flash. I miss having packages. I miss having private, protected, and public variables. I miss having getters and setters. I miss the organization of a Flash project. Javascript is so messy, even when it&amp;#8217;s done well.&lt;/p&gt;
&lt;p&gt;Mostly, I miss the Flash community.&lt;/p&gt;
&lt;p&gt;Don&amp;#8217;t worry duders, I&amp;#8217;ll be back.&lt;/p&gt;
&lt;img src="http://feeds.feedburner.com/~r/jacwright/~4/b8yuKMzr43M" height="1" width="1"/&gt;</content>
		<link rel="replies" type="text/html" href="http://jacwright.com/blog/495/i-miss-flash/#comments" thr:count="8" />
		<link rel="replies" type="application/atom+xml" href="http://jacwright.com/blog/495/i-miss-flash/feed/atom/" thr:count="8" />
		<thr:total>8</thr:total>
	<feedburner:origLink>http://jacwright.com/blog/495/i-miss-flash/</feedburner:origLink></entry>
		<entry>
		<author>
			<name>Jacob Wright</name>
						<uri>http://www.jacwright.com</uri>
					</author>
		<title type="html"><![CDATA[In-memory Javascript Database]]></title>
		<link rel="alternate" type="text/html" href="http://feedproxy.google.com/~r/jacwright/~3/P3oS3LZ8ZBg/" />
		<id>http://jacwright.com/blog/?p=489</id>
		<updated>2010-09-23T17:00:54Z</updated>
		<published>2010-09-24T14:00:51Z</published>
		<category scheme="http://jacwright.com/blog" term="HTML5" /><category scheme="http://jacwright.com/blog" term="Javascript" />		<summary type="html"><![CDATA[I wrote an in-memory Javascript database for a project at work. &#8220;What?!&#8221; you say? You heard me. In-memory&#8230;Javascript&#8230;database. Yes, there is a use-case for it. So our current HTML5 project has moved back its target coverage to IE8. Darn. No CSS3, standard event model, or implicit getters/setters (meaning no data-binding). But it still has localStorage [...]]]></summary>
		<content type="html" xml:base="http://jacwright.com/blog/489/in-memory-javascript-database/">&lt;p&gt;I wrote an in-memory Javascript database for a project at work. &amp;#8220;&lt;em&gt;What?!&amp;#8221;&lt;/em&gt; you say? You heard me. In-memory&amp;#8230;Javascript&amp;#8230;database. Yes, there is a use-case for it.&lt;/p&gt;
&lt;p&gt;So our current HTML5 project has moved back its target coverage to IE8. Darn. No CSS3, standard event model, or implicit getters/setters (meaning no data-binding). But it still has localStorage and sessionStorage, the ~5MB data store that an HTML5 app can use. So I wrote a JS database which is really just an array of objects with some easy API for filtering, sorting, limiting, and finding the object you need. Now I can store a bunch of data in memory, getting only the newest content when I poll the server, and much more quickly sort, filter, etc. the data for the user without round-trips to the server. And then when they close the app, I can JSONify the data in the localStorage and load their app much more quickly when the come back. They&amp;#8217;ll immediately see where they left off, then when the first server poll finishes they&amp;#8217;ll see they&amp;#8217;ve got unread items that they can scroll up to view.&lt;/p&gt;
&lt;p&gt;I found taffydb.com already existed, but I sure hate unreadable code, and I thought how I could make it faster using the built-in Array filter() method. So I built my own. I also added a full-text search index that can be used for finding based off of keyword matching. I&amp;#8217;m working on refactoring for a different query API that supports ORs and sub-expressions–or expressions within parenthesis (e.g. name == &amp;#8220;Jacob&amp;#8221; and (age == null or age &amp;gt; 10) and cool == true).&lt;/p&gt;
&lt;p&gt;Follow the &lt;a title="JaDE - Javascript Database Engine" href="http://github.com/jacwright/JaDE"&gt;progress of JaDE&lt;/a&gt; (Javascript Database Engine) on github.&lt;/p&gt;
&lt;img src="http://feeds.feedburner.com/~r/jacwright/~4/P3oS3LZ8ZBg" height="1" width="1"/&gt;</content>
		<link rel="replies" type="text/html" href="http://jacwright.com/blog/489/in-memory-javascript-database/#comments" thr:count="0" />
		<link rel="replies" type="application/atom+xml" href="http://jacwright.com/blog/489/in-memory-javascript-database/feed/atom/" thr:count="0" />
		<thr:total>0</thr:total>
	<feedburner:origLink>http://jacwright.com/blog/489/in-memory-javascript-database/</feedburner:origLink></entry>
		<entry>
		<author>
			<name>Jacob Wright</name>
						<uri>http://www.jacwright.com</uri>
					</author>
		<title type="html"><![CDATA[Reintroducing &#8211; Flight Stealth!]]></title>
		<link rel="alternate" type="text/html" href="http://feedproxy.google.com/~r/jacwright/~3/J3DCm2-G76c/" />
		<id>http://jacwright.com/blog/?p=484</id>
		<updated>2010-09-22T20:04:17Z</updated>
		<published>2010-09-23T13:00:40Z</published>
		<category scheme="http://jacwright.com/blog" term="Flash" /><category scheme="http://jacwright.com/blog" term="Reflex" /><category scheme="http://jacwright.com/blog" term="Stealth" />		<summary type="html"><![CDATA[Flight Stealth was a Flash component framework a year ago. It went away as the creators of Stealth and OpenFlux combined to create Reflex last year. But Stealth is back! Reflex is forked. There has been some disappointment that Reflex has forked. Many people have ignorantly but understandably attributed the split to Tyler, the project lead over [...]]]></summary>
		<content type="html" xml:base="http://jacwright.com/blog/484/reintroducing-flight-stealth/">&lt;p&gt;Flight Stealth was a Flash component framework a year ago. It went away as the creators of Stealth and OpenFlux combined to create Reflex last year. But Stealth is back! Reflex is forked.&lt;/p&gt;
&lt;p&gt;There has been some disappointment that Reflex has forked. Many people have ignorantly but understandably attributed the split to Tyler, the project lead over Flight Stealth. However, Ben Stucki was the one who wanted to fork. After deciding to fork and leave Reflex he asked Tyler if he could keep the Reflex name. Tyler graciously consented, deciding to use the old Stealth name, but since the only difference in a new fork is the projects&amp;#8217; names, he&amp;#8217;s gotten the short end of the stick, losing mind share, and for those who were against the fork, getting the blame.&lt;/p&gt;
&lt;p&gt;I believe both projects will move forward as a result of this fork. Their project leads each have a vision and direction in mind, and I&amp;#8217;m seeing the difference in goals will lead to different products and needs addressed by the projects. Although as Flash developers who currently only have one robust component set in our tool belts, it is hard to imagine the need for more than one alternative. However I believe we will find that one-size-fits-all is not an ideal goal and a specialized framework will always win out over a generic one in its own problem domain.&lt;/p&gt;
&lt;p&gt;Good luck to both projects and make us proud.&lt;/p&gt;
&lt;p&gt;As an aside, I designed the &lt;a title="Flight eXperience Design" href="http://flightxd.com/"&gt;flightxd.com&lt;/a&gt; website where Flight Stealth will be hosted. I am quite proud of what I did, not being a designer.&lt;/p&gt;
&lt;p&gt;Please join the &lt;a title="Stealth Google group" href="http://groups.google.com/group/flight-stealth"&gt;Stealth mailing list&lt;/a&gt; and find out how you can help. We have a website to put together, user docs that need to be written, components that need to be written, and much much more.&lt;/p&gt;
&lt;img src="http://feeds.feedburner.com/~r/jacwright/~4/J3DCm2-G76c" height="1" width="1"/&gt;</content>
		<link rel="replies" type="text/html" href="http://jacwright.com/blog/484/reintroducing-flight-stealth/#comments" thr:count="1" />
		<link rel="replies" type="application/atom+xml" href="http://jacwright.com/blog/484/reintroducing-flight-stealth/feed/atom/" thr:count="1" />
		<thr:total>1</thr:total>
	<feedburner:origLink>http://jacwright.com/blog/484/reintroducing-flight-stealth/</feedburner:origLink></entry>
		<entry>
		<author>
			<name>Jacob Wright</name>
						<uri>http://www.jacwright.com</uri>
					</author>
		<title type="html"><![CDATA[Type overloading in Javascript]]></title>
		<link rel="alternate" type="text/html" href="http://feedproxy.google.com/~r/jacwright/~3/Vg0X96tRbVs/" />
		<id>http://jacwright.com/blog/?p=481</id>
		<updated>2011-02-22T03:16:29Z</updated>
		<published>2010-09-22T18:57:19Z</published>
		<category scheme="http://jacwright.com/blog" term="General" />		<summary type="html"><![CDATA[One of the core aspects to the Simpli5 Javascript library is that the components you build don&#8217;t wrap DOM elements. They actually are DOM elements. This is accomplished using what I call type overloading. How it works is you take an HTML element in the DOM and make it a different type. It is important–or [...]]]></summary>
		<content type="html" xml:base="http://jacwright.com/blog/481/type-overloading-in-javascript/">&lt;p&gt;One of the core aspects to the Simpli5 Javascript library is that the components you build don&amp;#8217;t wrap DOM elements. They actually &lt;em&gt;are&lt;/em&gt; DOM elements. This is accomplished using what I call type overloading.&lt;/p&gt;
&lt;p&gt;How it works is you take an HTML element in the DOM and make it a different type. It is important–or maybe just ethical ;) –that this new type is a subclass of the original element type. You don&amp;#8217;t want to find out that a div is no longer a div, and Firefox has issues with this anyway. So how do you type overload? First create your new type.&lt;/p&gt;
&lt;pre&gt;
function MyDiv() {
    this.addClass('my-div');
}
&lt;/pre&gt;
&lt;p&gt;Then it needs to extend the HTMLDivElement type. There is a trick to this using a dummy type.&lt;/p&gt;
&lt;pre&gt;
function dummy(){}
dummy.prototype = HTMLDivElement.prototype;
MyDiv.prototype = new dummy();
&lt;/pre&gt;
&lt;p&gt;Then we can add methods to the MyDiv.prototype which we may later call.&lt;/p&gt;
&lt;pre&gt;
MyDiv.prototype.addClass = function(className) {
    var classes = this.className ? this.className.split(/\s+/) : [];
    if (classes.indexOf(className) == -1) classes.push(className);
    this.className = classes.join(' ');
};
&lt;/pre&gt;
&lt;p&gt;Now we have our new type. We can&amp;#8217;t just create it because to get an HTML element you have to go through document.createElement(). We can either do that or grab an element already in the DOM. Let&amp;#8217;s do the latter.&lt;/p&gt;
&lt;pre&gt;
var div = document.getElementsByTagName('div')[0];
&lt;/pre&gt;
&lt;p&gt;Now we have our div. The next part is type overloading. On every Javascript object is a special property &amp;#8220;__proto__&amp;#8221; (two underscores on both sides) which points to the object&amp;#8217;s prototype. It also has &amp;#8220;constructor&amp;#8221; which points to its type function. We just have to replace these two with our own, changing the type of the object at runtime.&lt;/p&gt;
&lt;pre&gt;
div.__proto__ = MyDiv.prototype;
div.constructor = MyDiv;
div.constructor(); // call the constructor for any initialization that needs to happen.
&lt;/pre&gt;
&lt;p&gt;We now have a div which is of type MyDiv. The following code all returns true and works.&lt;/p&gt;
&lt;pre&gt;
alert(div instanceof HTMLDivElement); // true since we subclassed it
alert(div instanceof MyDiv); // also true since this is our new type
div.addClass('foo'); // works, no errors, the method exists on div
alert(div.className); // "my-div foo" because our constructor added my-div and we just added foo
&lt;/pre&gt;
&lt;p&gt;It&amp;#8217;s a really neat thing that you can make objects become new types &lt;em&gt;at &lt;/em&gt;runtime. And since every HTML5 browser supported it at the time I wrote Simpli5 it seemed like a great solution. Unfortunately, not all browsers support the __proto__ property. Now that IE9 is publicly available in beta I&amp;#8217;ve given it a look. It does not support __proto__. After all, __proto__ isn&amp;#8217;t a standardized property. So for Simpli5 I&amp;#8217;ll have to for-i-in copy all the methods of my new type over to the instance of an element. It will be slower, and &amp;#8220;div instanceof MyDiv&amp;#8221; won&amp;#8217;t return true, but it should still work for our needs.&lt;/p&gt;
&lt;p&gt;Hey Microsoft, I know it isn&amp;#8217;t a standard property, but do you think you could make the __proto__ object a publicly accessible read/write property? I would really appreciate it!&lt;/p&gt;
&lt;img src="http://feeds.feedburner.com/~r/jacwright/~4/Vg0X96tRbVs" height="1" width="1"/&gt;</content>
		<link rel="replies" type="text/html" href="http://jacwright.com/blog/481/type-overloading-in-javascript/#comments" thr:count="0" />
		<link rel="replies" type="application/atom+xml" href="http://jacwright.com/blog/481/type-overloading-in-javascript/feed/atom/" thr:count="0" />
		<thr:total>0</thr:total>
	<feedburner:origLink>http://jacwright.com/blog/481/type-overloading-in-javascript/</feedburner:origLink></entry>
		<entry>
		<author>
			<name>Jacob Wright</name>
						<uri>http://www.jacwright.com</uri>
					</author>
		<title type="html"><![CDATA[Runtime Performance with CSS3 vs Images]]></title>
		<link rel="alternate" type="text/html" href="http://feedproxy.google.com/~r/jacwright/~3/cNUMjteRbNc/" />
		<id>http://jacwright.com/blog/?p=476</id>
		<updated>2010-07-30T20:57:15Z</updated>
		<published>2010-07-30T20:57:15Z</published>
		<category scheme="http://jacwright.com/blog" term="CSS3" /><category scheme="http://jacwright.com/blog" term="HTML5" />		<summary type="html"><![CDATA[I&#8217;m pretty happy with the great stuff CSS3 (and HTML5) brings. However, some care should be taken in balancing how many images you load versus the load you put on the CSS engine. And there are a lot of articles on the web encouraging use of the new CSS features such as gradients and shadows [...]]]></summary>
		<content type="html" xml:base="http://jacwright.com/blog/476/runtime-performance-with-css3-vs-images/">&lt;p&gt;I&amp;#8217;m pretty happy with the great stuff CSS3 (and HTML5) brings. However, some care should be taken in balancing how many images you load versus the load you put on the CSS engine. And there are a lot of articles on the web encouraging use of the new CSS features such as gradients and shadows in order to optimize for images in your page. But that&amp;#8217;s only half the story.&lt;/p&gt;
&lt;h3&gt;Image Optimization&lt;/h3&gt;
&lt;p&gt;CSS3 allows you to add drop shadows to your elements, gradients as their backgrounds, and rounded corners on their&amp;#8230; corners. Using these few capabilities (you might throw in a couple more like custom fonts and you can put together much of the web&amp;#8217;s design with only a few icons needed for images. This allows for much smaller page download because the definition for a shadow or gradient is only a few bytes but an image of these same things are usually kilobytes larger. Pages download much more quickly.&lt;/p&gt;
&lt;h3&gt;CSS Optimization&lt;/h3&gt;
&lt;p&gt;While you can do lots of great things with CSS3, drawing shadows and gradients dynamically can affect responsiveness in your page. If you find your page is not scrolling smoothly or dynamic pieces don&amp;#8217;t pop like you&amp;#8217;d want them to, you might want to optimize your CSS and use more images. Your page may download slower, but once it&amp;#8217;s there it will be more responsive.&lt;/p&gt;
&lt;h3&gt;Case-study on Page Performance&lt;/h3&gt;
&lt;p&gt;&lt;a href="http://jacwright.com/blog/wp-content/uploads/2010/07/Screen-shot-2010-07-30-at-10.04.55-AM.png"&gt;&lt;img class="size-full wp-image-478 alignnone" title="Screen shot 2010-07-30 at 10.04.55 AM" src="http://jacwright.com/blog/wp-content/uploads/2010/07/Screen-shot-2010-07-30-at-10.04.55-AM.png" alt="" width="607" height="489" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;I had a page with a lot of these gradients and shadows (see the previous picture, the original version was 100% CSS, it had no images at all), however, scrolling the page left and right was very clunky and unresponsive. I thought perhaps I had too many HTML elements on the page, but I&amp;#8217;ve seen much more work better. After playing around with code a bit it occurred to me that the dynamic calculations and drawing of the gradient&amp;#8217;s and shadows was affecting performance. This should have been more apparent to me since it is a common optimization in Flash when you use too much drawing API. After removing the shadows and gradients from my stylesheet the scrolling was smooth again, just like I would expect it to be. Removing the shadow helped out a lot more than removing the gradients. I theorized that the browser may have a better time layering images than it does calculating shadows and gradients, so I tested it out.&lt;/p&gt;
&lt;p&gt;After replacing all the gradients and shadows with images, I found my page still scrolled smoothly even though the same shadows and gradients caused it problems with CSS. For my particular case, I am creating a web application which users will come to and stay at for awhile. There is a lot of elements on the page, a lot of design parts to it, and in this particular developer-art incarnation of it, a lot of shadows.&lt;/p&gt;
&lt;p&gt;On a side note, the process to replacing the CSS shadows etc. with images was much less painful with CSS3. I didn&amp;#8217;t have to alter any HTML because you can layer backgrounds onto an element now so my elements had- background: url(topimage.png) no-repeat left top, url(bottomimage.png) left bottom, url(middleimage.png) repeat-y left; So even though I was forgoing CSS3 shadows it still made my life easier and my page simpler with the images.&lt;/p&gt;
&lt;h3&gt;The Right Balance&lt;/h3&gt;
&lt;p&gt;For many web pages out there adding a few shadows or gradients to the page will help make your page look that much nicer and doing it in CSS3 is easier to tweak when you don&amp;#8217;t have to re-export images from your site-design-file. But if you have performance problems in your page, you might try using images for some of the heavily repeated elements or the shadows in your page.&lt;/p&gt;
&lt;img src="http://feeds.feedburner.com/~r/jacwright/~4/cNUMjteRbNc" height="1" width="1"/&gt;</content>
		<link rel="replies" type="text/html" href="http://jacwright.com/blog/476/runtime-performance-with-css3-vs-images/#comments" thr:count="2" />
		<link rel="replies" type="application/atom+xml" href="http://jacwright.com/blog/476/runtime-performance-with-css3-vs-images/feed/atom/" thr:count="2" />
		<thr:total>2</thr:total>
	<feedburner:origLink>http://jacwright.com/blog/476/runtime-performance-with-css3-vs-images/</feedburner:origLink></entry>
		<entry>
		<author>
			<name>Jacob Wright</name>
						<uri>http://www.jacwright.com</uri>
					</author>
		<title type="html"><![CDATA[My First 10k, Trailer Park Style]]></title>
		<link rel="alternate" type="text/html" href="http://feedproxy.google.com/~r/jacwright/~3/RB0H5QVzhQg/" />
		<id>http://jacwright.com/blog/?p=446</id>
		<updated>2010-07-29T15:05:34Z</updated>
		<published>2010-07-29T15:05:18Z</published>
		<category scheme="http://jacwright.com/blog" term="General" />		<summary type="html"><![CDATA[I am finally getting around to sharing my memorial day adventure. I ran my first 10k here in Boulder (called the BolderBOULDER). It was pretty fun, considering I wasn&#8217;t in great shape for it. I outdid my expectations (I&#8217;m slow) with a 68 minute time. Our Jive team running the BolderBOULDER (voted best 10k in [...]]]></summary>
		<content type="html" xml:base="http://jacwright.com/blog/446/my-first-10k-trailer-park-style/">&lt;p&gt;I am finally getting around to sharing my memorial day adventure. I ran my first 10k here in Boulder (called the BolderBOULDER). It was pretty fun, considering I wasn&amp;#8217;t in great shape for it. I outdid my expectations (I&amp;#8217;m slow) with a 68 minute time. Our Jive team running the BolderBOULDER (voted best 10k in the country) planned out a sweet running uniform: jean cutoffs, wife-beater, Jive tattoo, fake mustache, and anything else that screamed &amp;#8220;TRAILER PARK!&amp;#8221;&lt;/p&gt;
&lt;p&gt;UNFORTUNATELY, I was the &lt;em&gt;ONLY&lt;/em&gt; one who really followed through on the whole outfit. Guess that means I&amp;#8217;m totally the winner in the style category. Here are some photos to commemorate the event.&lt;/p&gt;
&lt;p&gt;Starting out&lt;/p&gt;
&lt;p&gt;&lt;a href="http://jacwright.com/blog/wp-content/uploads/2010/07/startingout.jpg"&gt;&lt;img src="http://jacwright.com/blog/wp-content/uploads/2010/07/startingout-225x300.jpg" alt="Starting out" title="startingout" width="225" height="300" class="aligncenter size-medium wp-image-467" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;Just gettin&amp;#8217; going&lt;/p&gt;
&lt;p&gt;&lt;a href="http://jacwright.com/blog/wp-content/uploads/2010/07/61703-1335-006f.jpg"&gt;&lt;img src="http://jacwright.com/blog/wp-content/uploads/2010/07/61703-1335-006f-200x300.jpg" alt="" title="61703-1335-006f" width="200" height="300" class="aligncenter size-medium wp-image-469" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;Getting cooled off&lt;br /&gt;
&lt;a href="http://jacwright.com/blog/wp-content/uploads/2010/07/61703-3589-025f.jpg"&gt;&lt;img src="http://jacwright.com/blog/wp-content/uploads/2010/07/61703-3589-025f-199x300.jpg" alt="" title="61703-3589-025f" width="199" height="300" class="aligncenter size-medium wp-image-470" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;Breaking a mile barrier&lt;/p&gt;
&lt;p&gt;&lt;a href="http://jacwright.com/blog/wp-content/uploads/2010/07/gettingthrough.jpg"&gt;&lt;img src="http://jacwright.com/blog/wp-content/uploads/2010/07/gettingthrough.jpg" alt="" title="gettingthrough" width="151" height="178" class="aligncenter size-full wp-image-471" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;Home stretch&lt;/p&gt;
&lt;p&gt;&lt;a href="http://jacwright.com/blog/wp-content/uploads/2010/07/61703-5408-021f.jpg"&gt;&lt;img src="http://jacwright.com/blog/wp-content/uploads/2010/07/61703-5408-021f-201x300.jpg" alt="" title="61703-5408-021f" width="201" height="300" class="aligncenter size-medium wp-image-472" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;After Pose (mustache finally fell off)&lt;/p&gt;
&lt;p&gt;&lt;a href="http://jacwright.com/blog/wp-content/uploads/2010/07/afterpose.jpg"&gt;&lt;img src="http://jacwright.com/blog/wp-content/uploads/2010/07/afterpose-225x300.jpg" alt="" title="afterpose" width="225" height="300" class="aligncenter size-medium wp-image-473" /&gt;&lt;/a&gt;&lt;/p&gt;
&lt;img src="http://feeds.feedburner.com/~r/jacwright/~4/RB0H5QVzhQg" height="1" width="1"/&gt;</content>
		<link rel="replies" type="text/html" href="http://jacwright.com/blog/446/my-first-10k-trailer-park-style/#comments" thr:count="1" />
		<link rel="replies" type="application/atom+xml" href="http://jacwright.com/blog/446/my-first-10k-trailer-park-style/feed/atom/" thr:count="1" />
		<thr:total>1</thr:total>
	<feedburner:origLink>http://jacwright.com/blog/446/my-first-10k-trailer-park-style/</feedburner:origLink></entry>
		<entry>
		<author>
			<name>Jacob Wright</name>
						<uri>http://www.jacwright.com</uri>
					</author>
		<title type="html"><![CDATA[Developers Put Their Heads in the Sand]]></title>
		<link rel="alternate" type="text/html" href="http://feedproxy.google.com/~r/jacwright/~3/01RjdBe448Y/" />
		<id>http://jacwright.com/blog/?p=464</id>
		<updated>2010-07-23T19:45:29Z</updated>
		<published>2010-07-23T19:45:29Z</published>
		<category scheme="http://jacwright.com/blog" term="General" />		<summary type="html"><![CDATA[As developers, we like to put our heads in the sand. We&#8217;d be much more successful if we didn&#8217;t. Let me explain. When I first learned about basic object oriented programming, I was suddenly disgusted with functions and code that wasn&#8217;t an object. I got over it. When I learned about composition over inheritance, that [...]]]></summary>
		<content type="html" xml:base="http://jacwright.com/blog/464/developers-put-their-heads-in-the-sand/">&lt;p&gt;As developers, we like to put our heads in the sand. We&amp;#8217;d be much more successful if we didn&amp;#8217;t. Let me explain.&lt;/p&gt;
&lt;p&gt;When I first learned about basic object oriented programming, I was suddenly disgusted with functions and code that wasn&amp;#8217;t an object. I got over it.&lt;/p&gt;
&lt;p&gt;When I learned about composition over inheritance, that became the standard by which I judged all code, mine included. It became my fixation. I got over it.&lt;/p&gt;
&lt;p&gt;When I learned about design patterns, I wanted to apply them to every situation, and I wanted to do it &lt;em&gt;right&lt;/em&gt; and apply them &lt;em&gt;exactly&lt;/em&gt; the way prescribed in the pattern. &lt;em&gt;I got over it&lt;/em&gt;.&lt;/p&gt;
&lt;p&gt;When I learned about optimizing code, I spat on for loops that didn&amp;#8217;t initialize the length first, I kicked dirt around static methods which are shown to be slower (in the language I was using) than instance methods, and I generally despised any type of code which I read on a blog was slower than an optimized alternative. &lt;em&gt;&lt;strong&gt;I got over it&lt;/strong&gt;&lt;/em&gt;.&lt;/p&gt;
&lt;p&gt;I could go on with dependency injection, abstraction, database normalization, and on, and on, and on. I hope I continue to get over over-applying new knowledge.&lt;/p&gt;
&lt;p&gt;I&amp;#8217;ve always wanted to iterate over and rewrite again and again pieces of code, reusable libraries, and other gleaming nuggets I&amp;#8217;ve done in the past which could be more perfect. Even faster. Even better. I&amp;#8217;m getting over it.&lt;/p&gt;
&lt;p&gt;In the last few months I&amp;#8217;ve been working with some very bright and &lt;em&gt;&lt;a href="http://en.wiktionary.org/wiki/pragmatic" title="Practical, concerned with making decisions and actions that are useful in practice, not just theory"&gt;pragmatic&lt;/a&gt;&lt;/em&gt; developers. They&amp;#8217;ve been teaching me, unbeknownst to themselves, to look at the big picture and to get my freaking head out of the sand.&lt;/p&gt;
&lt;p&gt;Just because instance methods are slower than statics doesn&amp;#8217;t mean you shouldn&amp;#8217;t use them. Creating an object is slower than calling a method, but should we throw OOP out the window and stick with functional programming? Messing up the Flyweight pattern (or even heaven forbid, our blessed MVC pattern) by altering it from the original and all knowing gang-of-four specification doesn&amp;#8217;t end-of-life your product before it&amp;#8217;s out the door. What keeps your product from releasing is rewriting it, or pieces of it, over and over again. If it works, DON&amp;#8217;T FIX IT. Only optimize if your application is too slow for your users. And then only optimize the slowest parts. Next application you write you can do it better, but freaking finish! Clean up and refactor as you add new features for your users. Don&amp;#8217;t waste time redoing anything from scratch unless its complete junk. And if you wrote it, figure out why you&amp;#8217;re writing complete junk in the first place and fix the root of the problem.&lt;/p&gt;
&lt;p&gt;I&amp;#8217;m writing a &lt;a href="http://github.com/jacwright/simpli5" title="Simpli5 Javascript Library"&gt;library&lt;/a&gt; in Javascript for HTML5 applications that I know will make many Javascript developer weep. It flys in the face of all the wisdom and standards that they&amp;#8217;ve read about on their favorite blogs. But it will make developing applications easier and more maintainable. I know the rules, and thus I know how and when to break them because I know why they were established.&lt;/p&gt;
&lt;p&gt;I&amp;#8217;m still watching the development of Reflex, the Flash component library my brother is involved in (I&amp;#8217;m not actively participating anymore). They&amp;#8217;re fighting against head-sand-itis both externally and internally. Project supporters may disagree with things proposed because it&amp;#8217;s not right, or it&amp;#8217;s not as fast as machine code. Internally with themselves they&amp;#8217;re disgusted at breaking precious programming rules. Finally they&amp;#8217;re starting to let ideals slide because progression is so slow. Eventually, I hope, they&amp;#8217;ll raise their sites to the end goal and do what is necessary to reach it. Even if it means using brains instead of rules. (no offense to any individual person or the general group, we all struggle with it, we&amp;#8217;re developers)&lt;/p&gt;
&lt;p&gt;The rules are generalities, guidelines to help us until we understand the principle behind the rule well enough to make our own decisions. Understand your natural tendency to over-apply and work against your nature to be more pragmatic.&lt;/p&gt;
&lt;p&gt;May we all work on seeing the big picture, understanding the principle behind the rule, and creating great experiences for those who will use our applications. I&amp;#8217;m certainly the pot calling the kettle black on this.&lt;/p&gt;
&lt;img src="http://feeds.feedburner.com/~r/jacwright/~4/01RjdBe448Y" height="1" width="1"/&gt;</content>
		<link rel="replies" type="text/html" href="http://jacwright.com/blog/464/developers-put-their-heads-in-the-sand/#comments" thr:count="4" />
		<link rel="replies" type="application/atom+xml" href="http://jacwright.com/blog/464/developers-put-their-heads-in-the-sand/feed/atom/" thr:count="4" />
		<thr:total>4</thr:total>
	<feedburner:origLink>http://jacwright.com/blog/464/developers-put-their-heads-in-the-sand/</feedburner:origLink></entry>
	</feed>

