MooTools

In 2005, developer Valerio Proietti launched Moo.fx, an add-on for the then market-leading JavaS­cript framework Prototype. Still not satisfied with Pro­to­type's range of options, however, he decided to develop his own framework (version 0.87), which was finally released in December 2006 under the free MIT license and the name MooTools (My Object Oriented Tools). Today, a team of more than 20 de­velopers and designers is involved in the de­vel­op­ment of the framework that is used in around 3.3% of all web projects (as of October 2016) according to a study by w3techs.com, making jQuery and Bootstrap among the most popular JavaS­cript tools in the world.

The MooTools framework is a compact col­lec­tion of JavaS­cript tools arranged in a modular structure for advanced and pro­fes­sion­al JavaS­cript de­velopers. Thanks to elegant and well-doc­u­mented APIs and a strong object ori­ent­a­tion, the framework is char­ac­ter­ised by its flexible possible uses. It provides diverse functions and classes to assist de­velopers with pro­gram­ming and designing modern web projects and simplify the work process by a con­sid­er­able amount. Thanks to its modular structure, the framework is very easily ex­tend­able. In addition, the user can choose to integrate specific com­pon­ents that are actually needed, which is why MooTools ap­plic­a­tions are known for their high degree of clarity and com­pact­ness.

JavaS­cript is normally based on Prototype. MooTools, however, builds on a class-based in­her­it­ance system that serves as a basis for object-oriented pro­gram­ming and therefore for all com­pon­ents contained in the framework. This system does not only mean easy ex­tend­ib­il­ity, it also enables users to write reusable and flexible source code. With the help of pre­defined, modi­fi­able classes, you can also implement similar objects (plug-ins, HTML elements, Ajax requests, etc.) that all help you to save time. Among others, the following com­pon­ents can be expanded using MooTools JavaS­cript:

• Core: MooTools Core is the central element of the JavaS­cript framework upon which all com­pon­ents are based. As well as the im­ple­ment­a­tion of the class concept, Core contains some general support functions.

• More: MooTools More is the framework’s official plug-in col­lec­tion. It includes diverse ex­ten­sions that stream­lines the de­vel­op­ment process and adds further features.

• Class: the Class component is the basic class needed to in­stan­ti­ate (generate) reusable class objects and modify existing classes.

• Element: One of the key com­pon­ents that can be used to access or generate cross-browser-com­pat­ible HTML element objects. Contains the dollar functions, $ and $$.

• Fx: an effect module that serves as the basis for animating elements and therefore for scrolling, sliding and other effects.

• JSON: a module for coding and decoding character strings in the JSON format (JavaScript Object Notation).

Of course, some modules build on each other, so for example, the Fx.CSS module requires you to install the related Fx module as well. In general, however, you can select the com­pon­ents you need and download them in­di­vidu­ally to create your compiled MooTools framework. For this purpose, a list of in­di­vidu­al modules are divided into the two major cat­egor­ies: Core and More. It is also possible to download the complete basic package or all available ex­ten­sions. It’s also possible to download the complete basic package or all available ex­ten­sions.

The MooTools de­velopers provide a small taste of the in­di­vidu­al com­pon­ents with the MooTools demos available on aryweb.nl. There you’ll find present­a­tions of drag and drop functions, effects, and forms, as well as an in­tro­duc­tion to MooTools JavaS­cript, HTML, and CSS code lines.

In the mid-nineties, when dynamic elements were just beginning to enter web de­vel­op­ing projects, the source code’s location was in­creas­ingly trans­lo­cated to the client or browser. At first, it was all about Java applets until1995 when Brendan Eich developed the JavaS­cript pre­de­cessor LiveScript for the Netscape 2.0 web browser as an al­tern­at­ive to these ‘mini’ pro­grammes. The most no­tice­able dif­fer­ences was that JavaS­cript replaced classes with pro­to­types and that the pro­grammed lines of code were directly im­ple­men­ted into the actual HTML source code, rather than separated - a situation that has not changed to this day.

The primary purpose of JavaS­cript as a browser scripting language was to create com­pet­i­tion to the Java applets. However, the real break­through came in 2005 with the in­tro­duc­tion of web 2.0 and the sub­sequent de­vel­op­ment of web browsers and the DOM interface. All of a sudden, it was possible to load content in the back­ground using JavaS­cript that resulted in the first dynamic in­ter­faces emerging in the browser without plug-ins or the need to con­stantly com­mu­nic­ate with the web server. Several JavaS­cript libraries and frame­works have since emerged and as a result JavaS­cript has been the most widely used script languages for web de­vel­op­ment for the past decade. The average website has sim­ul­tan­eously evolved into an in­creas­ingly complex and in­ter­act­ive nexus of web ap­plic­a­tions - this has made JavaS­cript and JavaS­cript frame­works such as MooTools even more important for pro­gram­ming new projects. The script language is also now widely used on the server side

Nowadays, tra­di­tion­al static websites have a hard time staying relevant; in­ter­act­ive elements have long been a matter of course, so it is all the more important to engage with website visitors using in­nov­at­ive and user-friendly concepts. Loading speed also plays an important role here. This is largely dependent on how often the web ap­plic­a­tion accesses the server in order to process incoming browser requests. One kind of web project, which is becoming more popular for JavaS­cript frame­works such as MooTools, is a single-page ap­plic­a­tion - also known as onepager. This is a website made from a single HTML document that can display all of the content on a single page. In lieu of subpages, these websites have sections and events that the visitor can access or activate by scrolling or by clicking on buttons.

Storytelling is a par­tic­u­larly popular format as it allows users to present in­form­a­tion in the form of a small story with the aid of the in­ter­act­ive elements. In order to display a single-page ap­plic­a­tion, the web server only needs to exchange a small amount of data; this ensures a generally high per­form­ance. Thanks to JavaS­cript being widely supported, MooTools ap­plic­a­tions can be used seam­lessly across platforms and browsers.

Using JavaS­cript as a pro­gram­ming language means that the Mootools framework is in good company. Many highly suc­cess­ful al­tern­at­ives, including AngularJS and Ember.js, show just how high the demand for JavaS­cript frame­works is. Supported by all common browsers, the scripting language is un­dis­puted web standard as it is well suited to building in­ter­act­ive website com­pon­ents. The language is essential for web de­velopers, even if they do not use a class-based in­her­it­ance system by default. MooTools solves this problem by massively sim­pli­fy­ing the pro­gram­ming of recurring elements.

For a website visitor, the focus on a client-side ex­ecut­able source code seems to be an advantage at first glance; JavaS­cript elements promise a high level of in­ter­activ­ity while main­tain­ing a very good page loading speed. However, there are problems and risks with MooTools ap­plic­a­tions caused by the fact that the clients are re­spons­ible for the task of compiling code. This means resources are in par­tic­u­larly high demand, po­ten­tially leading to losses in per­form­ance or even a website crash in the case of low-per­form­ing clients and devices. These crashes par­tic­u­larly affect users of mobile devices such as smart­phones and tablets; this amounts to a very sig­ni­fic­ant pro­por­tion of internet users. In addition, the crashes often also lead to com­plic­a­tions with device-specific com­pon­ents such as touch screens or the com­par­at­ively small screen size of man devices, which are sometimes not tested properly be­fore­hand, if at all.

Executing code always carries the risk of being accessed ex­tern­ally (i.e. by using tracking or phishing methods), so users are par­tic­u­larly vul­ner­able when accessing web projects that use a large amount of client-side pro­gram­ming. Some internet users protect them­selves against this by using script blocking ex­ten­sions such as NoScript or JS Blocker, which prevents un­au­thor­ised websites (any site that is not manually added to the whitelist) from running JavaS­cript and other scripts. It’s therefore important to pay close attention to the security measures of your MooTools web ap­plic­a­tion in order to generate the users’ trust and appeal to your target audience.

MooTools builds on JavaS­cript‘s object-oriented approach and extends the popular web scripting language to include cus­tom­iz­able and reusable classes, following the example of Java and PHP. Using this framework enorm­ously improves the ef­fi­ciency of JavaS­cript pro­gram­ming. The strengths of the tool col­lec­tion are also high­lighted here.

It’s possible to design entire ap­plic­a­tion based on MooTools, although this is not ne­ces­sar­ily suitable for every project. While effects, an­im­a­tions, and AJAX com­pon­ents are of course in­creas­ingly important in modern web de­vel­op­ment, when im­ple­ment­ing any project, the user ex­per­i­ence should always be the main priority. For this purpose, MooTools and JavaS­cript are generally excellent building blocks, but they should only be used in mod­er­a­tion, otherwise your web ap­plic­a­tion runs the risk of quickly breaking the technical resources of the user clients.