Updated: Sep 10, 2018
With the arrival of the new version of the Zebkit framework, I thought it would be good to step back and cover just some the ways that Zebkit has helped us at Massive Analytic build out some of the great features of Oscar. Also, as Zebkit doesn't get much coverage in the web media, I felt a general introduction to the uninitiated was warranted. Follow the links throughout the article to learn more.
Zebkit is primarily a frontend GUI framework built on HTML5 canvas, it has been used throughout Oscar to provide a fast Dashboarding interface, an easy way to organise and build components, and in our Chart-API and Scripting modules it provides the top level constructs which make everything possible.
For example, some of the most common Oscar elements such as the Dashboard Edit mode , Organizer, Data Workshop and Admin sections are 100% Zebkit built GUI. In Dashboard Edit Mode we get an infinite canvas to add charts, only what you see is rendered. In the Organizer you can manage all your Big Data in a single place because Zebkit makes sure to only render what you are looking at any given moment.
Why did we choose Zebkit? Oscar is a large application, we needed a way to harmonise packages, dependencies, stop repeating ourselves every time we wanted to add a new chart for example. The Zebkit Easy OOP can also run in NodeJS no problem, so we instantiate some things (entire Dashboards if necessary) on the server, create configs, etc, before anything even gets rendered.
Zebkit doesn't have a massive user base (yet!) or big players such as Facebook or Google backing it. Luckily Massive Analytic is a highly innovative company and aren't afraid of being an early adopter for new technologies. There are however plenty of examples on the website and in the help files to make your first steps.
For programmers, anyone one who was familiar with ActionScript will know the advantages of subclassing display objects, the same is true for Zebkit, the Easy OOP structure combined with base classes such as Panel gives the coder immense power to execute any designs they want from the ground up. Coders can plan clearly what they want to do and not be encumbered by limitations in frameworks, CSS edge cases or nested DOM objects, making the whole design to execution process a lot more pleasing.
There is also a huge opportunity for designers to get involved here, we've done quite a bit to improve the general look and feel of the default Zebkit theme in Oscar's own json view definitions, but there are no limitations to what themes you can create, if you want a 'Material Design' template for Zebkit for example, then go make one!
One component needs a special shout out, and that is the Grid component, with that you can load many millions of dynamically generated cells with zero DOM load, at Massive Analytic we have combined that with lazy loading methods to create the ultimate extendable grid component, used for our Spreadsheet chart type and to create a Table class that takes the power of Grid but renders in a way that has the familiar look and feel of styled HTML tables.
That's all great, but what can we get with the new version? There are several game changers in the new version, a powerful re-implementation of Promises called 'D-then', the ability to define your whole UI in an extended json format called 'Zson', and massive improvements in the ability to mix and match Zebkit with HTML elements. Try it out!