dan

jquery replacement

Mon, 22 Mar 2010 23:10:00 -0400

as i begin to make mobile apps, it’s become painfully clear that i simply don’t have the performance i’m used to in a browser. while i write fast javascript, i am stuck using jquery for the time being. I’m not a jQuery fan, but i’m not out to get it either. it is what it is, and it works.

The problem is that it works slowly. I re-wrote the fade routine a few months back. mine uses 1/3 the cpu of jQuery’s native routine. I wanted more than just faster fades, i want fast everything, so i began another library.

I don’t think it will replace jQuery, which at this point has a million nooks and crannies to replaicate. After reviewing what i use jQuery for, and what takes a long time to run, i’ve settled a a subset of functionality. The syntax is similar, but not compatible with jQuery.

On the technical end, it’s based around Arrays of elements instead of jQuery’s custom objects. This lets me use [].map(), [].filter(), etc on the result set. The css selector is next gen: querySelectorAll() only, no backwards css path decoding codebase. I have the usual methods like show, attr, html, hide, each, toggle, css, events, etc at least partially working.

the whole thing is currently ~2kb compressed, and performs about 8-12X faster than jQuery.
It’s complimenting to jQuery and does the same basic things, but fast.
if anything becomes of it, i’ll let you know.

libraries

Mon, 28 Dec 2009 19:42:48 -0500

i had sworn off creating libraries, but i can’t stop myself. I will be releasing three new libraries in the next few weeks.

1. a sequal to my F functional programming library, this time with several Function prototypes.
2. a Haskell data.list array method [].prototype package. almost all the Haskell functions are done.
3. a 10kb version of Prototype, all the same String and Array methods with some other bonuses.

stay tuned for updates.

on accessibility

Thu, 08 Oct 2009 05:37:23 -0400

use consistent html from page to page.
even if your page is hard to use, a user knowing they have to jump ahead 20 links each page visit saves them a ton of time. if each page is different, that predictability is lost. It’s like the difference between cooking in your own kitchen versus a strangers. don’t make them constantly “look” around.

sectionize everything.
the idea is to group related info and features together so that a user can jump to a section, and then find the part they needed. imagine a grocery store without aisles or signs, how would anyone find anything?

like a store, use big signs to point to your most important sections.
h1s for nav, content and footer.
h2 for content sections
h3 for each paragraph (or two or three) of page content.

standard sections include headers, navigation, content, contact info, table of contents, and footers.

add a “skip to” menu, or use ARIA landmark roles.

don’t use
, use

don’t put meaning less text (“click here”, “more…”) inside of links, use the text as a label for the content. (“download page”, “NYT article about polar bears”).

don’t repeat yourself in link text, each should be unique.
if not possible, use the title attrib to add more info.

make the text of the navigation menu as short and direct as possible.

Place the most important word first, or asap, in all H1-5, labels, legends, and A tags.
to wit: never label like:
Enter your name, Enter your address, Enter your zip…

realize that there is no skimming, or glancing: they have to wait for steven hawking to read the label to them before they decide if that’s what they want.
the less they have to listen to, the faster and easier your site will be to use, which reflects well on you.

if you make a flowchart of how a screen reader user would navigate your site, keep in mind that H tags, legends, and links are the decision points.

people who read screens will benefit from these changes as well.

35char jsonp fetcher for jQuery

Sun, 04 Oct 2009 01:03:00 -0400

//so you can paste into firebug
    $=jQuery;

// verify script load (just for this demonstration)
    window.mini=function(){alert('hello');}

//here's how to add a script:
    $("head").append("