background preloader

Comparison of JavaScript frameworks

Comparison of JavaScript frameworks
Related:  JavaScript

Review - Top 10 Javascript MVC Frameworks UPDATE 1/14/2012: Added Batman.js and Angular.js due to popular demand and because they looked impressive. Over the last several months I have been in a constant search for the perfect javascript MVC framework. Driven by a dire need for the right level of abstraction and features, I have tried out - some more cursorily than others - every framework I could get my hands on. Here lies a brief synopsis of each framework. Lastly, I share the framework which I ultimately decided on. Specifically, the following four features are very important to me: UI Bindings - I'm not just talking about templates, I'm talking about a declarative approach to automatically updating the view layer when the underlying model changes. The Contenders Here is a table showing all of the frameworks support for the above features. 1. Backbone.js is the web's darling framework. Pros: Strong community and lots of momentum. Cons: Lacks strong abstractions and leaves something to be desired. 2. Pros: Bindings support. 3.

Microjs: Fantastic Micro-Frameworks and Micro-Libraries for Fun and Profit! YUI Library In September 2009, Yahoo! released YUI 3, a new version of YUI rebuilt from the ground up to modernize the library and incorporate lessons learned from YUI 2. Among the enhancements are a CSS selector driven engine, like jQuery, for retrieving DOM elements, a greater emphasis on granularity of modules, a smaller seed file that loads other modules when necessary, and a variety of syntactic changes intended to make writing code faster and easier.[3] Features[edit] The YUI Library is fully documented on its website; detailed API documentation accompanies the library download. It has six types of components: YUI core, utilities, UI controls, CSS components, developer tools, and build tools. Core[edit] The YUI Core is a light (31KB minified) set of tools for event management and DOM manipulation. YUI Global Object The YUI Global Object contains language utilities, a script loader, and other baseline infrastructure for YUI. Dom Collection Event Utility Utilities[edit] Animation Browser History Manager

AngularJS : pourquoi les développeurs en sont fous La popularité du framework JavaScript ne cesse de croitre. Quelles sont ses véritables points forts comparés à ses concurrents ? Qu'apporte AngularJS 2.0 qui vient de sortir ? Télécharger AngularJS (site du projet)1- AngularJS est devenu la référence des infrastructures JavaScript côté client Sur le terrain des infrastructures JavaScript, historiquement très nombreuses, plusieurs solutions commencent à s'imposer. Mais qu'en est-il des infrastructures JavaScript côté client ? D'après les premiers indicateurs dont nous disposons autour de la valorisation de l'expertise Angular en termes de salaire, il semble qu'elle commence à être assez élevée en France. A lire aussi : 2- Une infrastructure Modèle-Vue-VueModèle pour gagner en productivité En trois ans, la popularité d'AngularJS a explosé (cf. le graphique Google Trend ci-dessous). Le principe du MVVM est simple : les données que le client saisies engendrent une mise à jour du contrôleur qui met à jour par ricochet la vue. A lire aussi :

How Browsers Work: Behind the scenes of modern web browsers Web browsers are the most widely used software. In this primer, I will explain how they work behind the scenes. We will see what happens when you type in the address bar until you see the Google page on the browser screen. The browsers we will talk about There are five major browsers used on desktop today: Chrome, Internet Explorer, Firefox, Safari and Opera. The browser's main functionality The main function of a browser is to present the web resource you choose, by requesting it from the server and displaying it in the browser window. The way the browser interprets and displays HTML files is specified in the HTML and CSS specifications. Browser user interfaces have a lot in common with each other. Address bar for inserting a URIBack and forward buttonsBookmarking optionsRefresh and stop buttons for refreshing or stopping the loading of current documentsHome button that takes you to your home page The browser's high level structure The browser's main components are (1.1): Syntax:

Scroll/Follow Sidebar, Multiple Techniques Really simple concept today folks! A sidebar that "follows" as you scroll down a page. There are a number of ways to go about it. We'll cover two: CSS and JavaScript (jQuery) with a bonus CSS trick. View Demo Download Files The easiest way to handle this is just to use CSS fixed positioning. With this technique, the sidebar stays solidly in place as you scroll down the page. jQuery If we use JavaScript, we can measure how far down the window the user has scrolled after a window.scroll event. Optimized by Doug Neiner: There is no particular advantage here other than the cool animated effect we get, which will certainly draw attention to it. Bonus "reveal" technique On Tim Van Damme's individual blog posts have a special sidebar with a fun "reveal" effect when the page is scrolled down. The trick is to have a header area with a solid background sit on top of the sidebar, which is pulled up underneath it. Concerns Cross-Browser Hoo-Hah This should work in "all" browsers. MooTools

Douglas Crockford - Google+ - JSDev JavaScript is a difficult language to test with.… JSDev JavaScript is a difficult language to test with. Unit testing wants to pull each function out to be tested individually, but that extraction can break the amazing implicit structures that nesting can produce. We know how to use closure to obtain privacy, but some advocate the refusal of privacy to favor testability. So I'm thinking that I want to insert some testing infrastructure directly into my program, delivering direct, explicit access to the private material. So I want to code that stuff as tagged comments (similar to the /*jslint*/ comments) and have a tool that converts the comments into executable forms automatically at development time. The program that does this is a companion to JSMin called JSDev.

Dojo Toolkit Overview[edit] Dojo is a JavaScript framework targeting the many needs of large-scale client-side web development. For example, Dojo abstracts the differences among diverse browsers to provide APIs that will work on all of them (it can even run on the server under Node.js); it establishes a framework for defining modules of code and managing their interdependencies; it provides build tools for optimizing JavaScript and CSS, generating documentation, and unit testing; it supports internationalization, localization, and accessibility; and it provides a rich suite of commonly needed utility classes and user-interface widgets. Dojo is completely open-source. The Dojo Toolkit is organized in several parts: Features[edit] Widgets[edit] Dojo widgets are components — comprising JavaScript code, HTML markup, and CSS style declarations — that provide multi-browser (not to be confused with cross-browser), interactive features: Themes[edit] Asynchronous communication[edit] Packaging system[edit]

10 frameworks JavaScript parmi les plus prometteurs Devant le casse-tête que pose parfois la sélection d'un projet de framework JavaScript, la force de la communauté devrait être l'un des facteurs décisifs du choix et peut aider à déterminer lequel adopter. Explications. Vous tentez de décider lequel des frameworks JavaScript UI sera le plus adapté aux besoins de votre projet ou de votre organisation mais le casse tête n'en finit pas... Avec au moins 10 candidats sérieux, le choix ne s'annonce pas des plus simples. Il faut dire qu'au cours des dernières années, nous avons assisté à une croissance phénoménale dans le monde des frameworks et des bibliothèques JavaScript, pour la plupart Open Source. Devant le nombre impressionnant de projets Open Source lancés en 2012, concentrons-nous plus spécifiquement sur les projets de bibliothèques frameworks JavaScript centrés sur l'aide aux développeurs pour la conception d'interfaces utilisateurs riches et évolutives. Etude du nombre de contributeurs mensuels Etude des contributeurs sur la durée

IE + JavaScript Performance Recommendations - Part 1 - IEBlog Hello again, this is Peter Gurevich, Performance PM (among other things) for IE7. We have heard a lot of requests to improve our Jscript engine, especially now that AJAX sites are becoming more prevalent on the web. I want you all to know that we have been listening and have recently made some great fixes to our engine to improve the garbage collection routine and to reduce unbounded memory growth. You should see noticeable improvements on AJAX sites in the Release Candidate we shipped last week. I want you also to know that performance of the object model and JavaScript engine will be an area that we focus on strongly in future releases. While investigating the performance issues on script heavy sites we noticed several design patterns that resulted in less than optimal script performance. To that end, this blog will be the first in a 3 part series focusing on developing performance optimized scripts for web pages, covering the following: Symbolic Look-up Recommendations Thanks,

How to add Floating share box to your website advertisement After spending couple of hours searching for floating share box plugin for WordPress, I finally decided not to use plugins. Those plugins were not good enough to produce what I thought of like menus on Mashable or Hongkiat. Then I came across this article Scroll/Follow Sidebar, Multiple Techniques by Chris Coyier. In this tutorial, I will use same jQuery code from Chris Coyier’s article and will add some bits and pieces to build a floating share box. Keep in mind this is not a plugin, but can be integrated with static as well as dynamic sites. Enter your email and download it now! Enter your email address and the download link will be sent right to your inbox. Step 1 Create a HTML page and add Div’s with id’s to structure page. Step 2 Add a DIV just below the page-wrap DIV with your social media buttons (Retweet, Facebook, Stumbleupon…). Step 3 From HTML IPSUM copy some dummy text to fill empty main and sideebar DIV. Step 4 Next add jQuery code between head tag. Step 5 Step 6

html - Inline onclick JavaScript variable 30 Selected Admin Panel Template Collection In this article you will find an up-to-date collection of powerful admin panel template designs based on Twitter Bootstrap. So, if you are searching for a professional admin panel template for your next project, this is a good place to be looking. Bootstrap has become a quite popular collection of free HTML and CSS-based web development tools. It is responsive framework based on design templates for typography, forms, buttons, charts, navigation and more. The fully customizable admin templates available today has also become notably popular. You can look at it like this. Building an admin interface from scratch can be complicated and arduous work, plus you need to have a strong design stitched to it. Please tell us what you think! Advertisement Disclosure: Please note that some of the links below are affiliate links and I will earn a commission if you purchase through those links (at no extra cost to you). Admin Lab – Responsive Admin Dashboard Template – MORE INFO Author : Anders

Découvrir la bibliothèque Modernizr : Qu’est-ce que c’est ? A quoi ça sert ? Comment ça marche ? Il est de plus en plus rare aujourd’hui de trouver un web designer qui ne code pas ses propres créations. Il y a tant de ressources en ligne qui enseignent les bases du HTML et CSS (Apprendre le HTML5 par exemple …), et puisque ces langages sont très facile et s’apprennent rapidement, il y a maintenant beaucoup de graphistes qui ont des connaissances de base de balisage et de style. Mais si une fonctionnalité HTML5 ou CSS3 ne fonctionne pas dans certains navigateurs, nous devons nous assurer que nous offrons à ces navigateurs une alternative secondaire ou de secours. Donc, dans cet article, je vais vous présenter une façon de vous assurer que vos conceptions sont en mesure de tirer parti des nouvelles fonctionnalités HTML5 et CSS3 en utilisant la bibliothèque JavaScript Modernizr. Si vous ne maitrisez pas ou ne connaissez rien au JavaScript, aucun problème. Il vous suffit juste d’avoir des bases en CSS et en HTML5 pour suivre ce tutoriel. Qu’est-ce que Modernizr ?

Related:  jQueryJavascript