Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery plugins vs widgets

Tags:

Few months ago I started some experiments with jQuery plugin. I found some tutorials on the Interenet and I started to put something together.
A couple of days ago I had the need to build my own "plugin" and got back to my old project. Trying to find some more informations on the internet, I bumped in these new "things" called widgets.

For what I understand I should forget about plugins and start developing widgets. Are the plugins an old concept or are still valid? What is the best approach if you need a custom jquery control with interface?

I am using extensively jQuery UI.

like image 314
LeftyX Avatar asked Jun 07 '11 17:06

LeftyX


People also ask

What are jQuery plugins?

A jQuery plugin is simply a new method that we use to extend jQuery's prototype object. By extending the prototype object you enable all jQuery objects to inherit any methods that you add. As established, whenever you call jQuery() you're creating a new jQuery object, with all of jQuery's methods inherited.

What is jQuery widget factory?

The jQuery UI Widget Factory is an extensible base on which all of jQuery UI's widgets are built. Using the widget factory to build a plugin provides conveniences for state management, as well as conventions for common tasks like exposing plugin methods and changing options after instantiation.


2 Answers

I had an equivalent question my self and I stumble on this (jQuery Documentation):

Stateless vs. Stateful Plugins

Most jQuery plugins are stateless; they perform some action and their job is done. For example, if you set the text of an element using .text( "hello" ), there is no setup phase and the result is always the same. For these types of plugins, it makes sense to just extend jQuery's prototype.

However, some plugins are stateful; they have full life cycles, maintain state, and react to changes. These plugins require a lot of code dedicated to initialization and state management (and sometimes destruction). This results in a lot of boilerplate for building stateful plugins. Even worse, each plugin author may manage life cycles and state differently, resulting in different API styles for different plugins. The widget factory aims to solve both problems, removing the boilerplate and creating a consistent API across plugins.

Consistent API

The widget factory defines how to create and destroy widgets, get and set options, invoke methods, and listen to events triggered by the widget. By using the widget factory to build your stateful plugins, you are automatically conforming to a defined standard, making it easier for new users to start using your plugins. In addition to defining the interface, the widget factory also implements much of this functionality for you. (...)

Setting Options on Initialization

Whenever you build a plugin that accepts options, you should define defaults for as many options as possible, then merge the user-provided options with the defaults on initialization. (...) The widget factory provides this functionality and even takes it a bit further.

I'm posting here for feature reference since this is where I'm first looking for an answer! :)

like image 158
Lazaros Kosmidis Avatar answered Sep 18 '22 21:09

Lazaros Kosmidis


You can either write a jQuery plugin or a jQuery UI widget.

Depends on what you want to do. Neither of these is outdated. If you write a widget, it will depend on jQuery UI (and jQuery of course), if you write a plugin, it will only depend on jQuery. Really, it depends on what you want to achieve.

like image 22
kapa Avatar answered Sep 18 '22 21:09

kapa