A comparison of the jQuery UI Widget Factory and the YUI 3 Widget class.

jquery-yui-widget.md

jQuery

Widget foo.js

(function($, undefined){
    
    $.widget('ui.foo', {
        
        options: {
            color: 'Green'
        },
        
        _create: function () {
            
        },
        
        _init: function () {
            
            this._trigger('kapow');
            
        },
        
        _destroy: function () {
            
        }
        
    });
    
})(jQuery);

Dependencies

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.js"></script>

Implementation

$('.foo')
    .foo({
        color: 'Red',
        kapow: function () {
            alert('Kapow!');
        }
    })
    ;

YUI

Widget foo.js

YUI.add('foo', function(Y) {
    
    
    Y.namespace('UI').Foo = Y.Base.create('foo', Y.Widget, [], {
        
        initializer: function (config) {

            this.fire('kapow');
            
        },
        
        destructor: function () {
            
        },
        
        renderUI: function () {
            
        },
        
        bindUI: function () {
            
        },
        
        syncUI: function () {
            
        }
        
    }, {
        ATTRS: {
            color: {
                value: 'Green'
            }
        }
    });
    

    
}, '1.0.0' ,{requires:['widget','base-build']});

Dependencies

<script src="https://ajax.googleapis.com/ajax/libs/yui/3.3.0/build/yui/yui.js"></script>

Implementation

YUI({
    modules: {
        foo: {
            fullpath: '/path/to/foo.js',
            requires: ['widget', 'base-build']
        }
    }
}).use('foo', function(Y){
    
    var foo = new Y.UI.Foo({
        srcNode: Y.one('.foo'),
        color: 'Blue',
        on: {
            kapow: function () {
                alert('Kapow!');
            }
        }
    });

    foo.render();
    
});

my suggestion would be to use the Y.Base.create method and move your render() to be external. you can supply render:true to your config when you build if you want to have it render right away, but it's common practice to have your widget be instantiated independently from rendering