Created: 2011-07-13 02:58
Updated: 2014-11-11 22:15


A simple and lightweight framework script for modular development. Aims to standardize and organize development patterns, and avoid namespace clutter.

#version 2.x.x!#

What's new:

  • complete overhaul
  • instance constructor
  • structured approach to defining methods as modules
  • $ to trigger existing modules
  • $tartup.get() to get already defined modules
  • $tartup.pageReady() not required anymore (will fallback to document.ready)!

Including Startup

The Startup file can be included wherever you'd like it to be in your markup. Although following best practices, it should be in your <head> or at the bottom before your closing </body> tag.

Your control code

Declaring variables is not needed anymore!

###Discontinued: (function(){

     * The 3 Important variables to declare
    var Add = $,
        DOC_Ready = $,
        PAGE_Ready = $;

Use it how you like your shots.. straight up! (below)

Setting up your modules

It's very easy to set up:

$tartup.module([name:string], [type:string], [context:function|object]);

name (optional)

  • module name
  • must be unique -- dupes will be ignored (a console.log will let you know)
  • if not defined (anonymous modules), it will not be stored and cannot be accessed with .call() or .get()

type (optional)

  • options:

    • page - (default) triggered on .pageReady()
    • document - triggered on document.ready event
    • window - triggered on window.onload event
    • noexec - explicitly tell Startup to not execute the function/object
  • If inline .pageReady() is not declared, it will fallback as to document type


  • function - function gets triggered

  • object

    • only objects with .init() gets triggered
    • objects without it will only get stored

Triggerring Scripts inline

Sometimes, you'd like to execute scripts inline before the document is ready. You will need to put this at the very bottom before your closing </body> tag.

    . . .


Module declaration

// function
$tartup.module("foo", function(){

// object
$tartup.module("bear", {
    init: function() {

// on document.ready
$tartup.module("foobear", "document", function(){
    console.log("foo.bear @ document.ready");

// on window.onload
$tartup.module("foo.bear", "window", {
    init: function() {
        console.log("foo.bear @ window.onload");
    roar: function() {

// type "noexec" - doesn't get executed on module declaration
$tartup.module("foo_noexec", "noexec", function() {
    console.log("noexec option");

Anonymous module declaration

// these modules will not be stored

$tartup.module(function() {

    init: function() {

Call Module

// .init() gets triggered

// "noexec" type declaration will get ignored, it will still get executed
$"foo_noexec"); // --> will still trigger the function

Get Module

// .init() doesn't get triggered
var foobear = $"foo.bear");

###Creating new instances###

If you need to define multiple instances of Startup, the .newInstance() function will return a new unique instance

// create an instance
var MyInstance = $tartup.newInstance();

MyInstance.module("foo", function(){
    console.log("my foo instance");

var AnotherInstance = $tartup.newInstance();

AnotherInstance.module("foo", function(){
    console.log("another foo instance");

// default startup instance
$tartup.module("foo.bear", function(){
    console.log("foo bear");

// you cannot .get() or .call() from other instances
MyInstance.get("foo.bear"); // --> returns null"foo"); // --> returns "my foo instance""foo"); // --> returns "another foo instance"

Setting default type on new instance

// this instance's default execution type on 'window' instead of 'page'
var SomeInstance = $tartup.newInstance({
    defaultType: "window"

// default exection on window.onload
SomeInstance.module("foo.window", function(){
    console.log("default on window.onload event");


DomReady v0.3.0 by Dustin Diaz (needed old IE support!)

Cookies help us deliver our services. By using our services, you agree to our use of cookies Learn more