What is the different between Adaptive JS & Mobify JS?
Mobify JS is actually one of our older legacy products that we no longer offer as a service to clients anymore. Adaptive JS is our new framework we use to create mobile websites. You can read more on Adaptive JS here:
Let me know if you have any more questions.
We learned a great deal from our years of experiences building sites with mobify.js – adaptive.js is really just the reimagining of what the framework should be and how it should work. Think of it more as an evolution rather then a revolution – at it’s core, you’re still adapting existing desktop sites for mobile devices. Here is a list of some of the key improvements:
Uses modern toolchains:
- Require.js for dependancy management (rather then using templating to bring in different libraries – a feature most people likely didn’t even touch in mobify.js).
- Grunt.js for the task runner. This replaces `mobify-client` that you’d typically use with mobify.js projects. Adaptive.js comes with a base set of Grunt plugins, but you’re free to add any other plugins/tasks into your project that you wish (imagine for example, you wanted to run your tests on Saucelabs – that is very easy to integrate into your project using the provided Gruntfile).
- Bower for package management of front-end assets. While it was possible to use bower with mobify.js, we make it easy to use with adaptive.js
- With mobify.js, it was very difficult to bring in different libraries into your project when doing the initial adaptation (the konf). Since adaptive.js uses require.js at it’s core, its very easy to swap libraries, such as which selector engine you’d like to use (jquery vs zepto), which templating engine you’d like to use (although dust.js is highly encouraged), etc.
Uses an MVC paradigm:
- With mobify.js, all of your controller and routing logic is in one giant file – the mobify.konf. In adaptive.js, we’ve moved things to be much more MVC-like to make things more familiar for developers. For example, the controller logic for the header, footer, and each view are contained within their own files. The router is also a file of its own that maps routes to views. We find it to be much cleaner then the “context.choose” method of mobify.js.
Easier to debug:
- With mobify.js, debugging inline scripts in your templates was a nightmare, and unfortunately, writing inline scripts was encouraged. With adaptive.js, we start people off right by putting those scripts in an external file for easy debugging, as well as to reduce the filesize of the initially loaded file for improved performance.
- There are many performance tweaks we made that makes adaptive.js shine over mobify.js. And stay tuned, there are plenty more improvements to come!
- Writing tests for mobify.js was very difficult and not built into the framework. Adaptive.js was built with testing in mind right from the get go. When you generate an adaptive.js project, it comes with a set of basic tests to start you off on a road of writing amazing tests to ensure your project is stable and reliable!
I encourage you to follow the instructions to generate a scaffold for yourself. After looking at the scaffold, you’ll get a sense for the similarities and differences between adaptive.js and mobify.js!
Adaptive.js as a whole is not an open-source framework, although it does use some open-source libraries like Require.js, Grunt, Bower, Yeoman, and more.