cancel
Showing results for 
Search instead for 
Did you mean: 
ddraper
World-Class Innovator
World-Class Innovator

Introduction

For some time now I've been writing blog posts that refer to the 'updated UI framework' describing a new approach that we've been working on for further developing Alfresco Share. This is a fairly ambiguous (as well as lengthy) term to use to describe what we've been up to and we thought it would be sensible to come up with a project name that encapsulates the work that we've been doing. The framework is completely reliant on Surf so we wanted it to be somehow Surf related so after throwing a few ideas around settled on the name 'Aikau'. This post is going to attempt to describe exactly what Aikau is and why we've been working on it.

What is Aikau?

Aikau refers to a method of creating new Surf Pages or Components comprised of small atomic widgets. The widgets are referenced in a JSON model that can either be defined in the JavaScript controller of a WebScript or as a document stored on the Alfresco Repository. Each widget is an AMD module that references it's own CSS, HTML and i18n resources Surf will ensure that all of those resources are imported into the page loaded by the browser when that widget is referenced in the JSON model that defines that page.

The widgets are intentionally de-coupled over publication/subscription communication and event frameworks so that widgets can be easily added/removed/changed within a JSON model without causing any missing reference errors. Each widget is intentionally designed to implement a single piece of function, but can themselves define JSON models of child widgets so that it is easy to define re-usable composite widgets.

Each widget should be written with customization in mind - methods are kept short and variables abstracted to allow configuration and allow customization through targeted method overrides in extending widgets.

Aikau also provides an Intern.io based unit testing framework and each widget should have it's own unit test (although we don't yet have 100% code coverage) to ensure that functionality is not broken during development. We aim to make use of tools such as Grunt and Vagrant to allow continuous testing to run in parallel with development to catch breaking code immediately (although this effort has not yet been completed).

What Are The Goals?

The primary goal of of Aikau are to:

    • maximize code re-use
    • make UI development faster
    • make it incredibly simple to customize pages
    • allow continuous iteration of existing pages.


Aikau leverages the existing Surf extensibility capabilities to allow a default JSON model to be manipulated by 3rd party extensions. This allows pages to be heavily customized without needing to access or work with the source code of the page - it is possible to isolate the customization work to just the specific target areas.

Performance improvements should also be achieved by only loading the minimum amount of JavaScript and CSS data into the browser and by reducing the number of HTTP requests to an absolute minimum.

One of the main benefits of Aikau is that it allows you to quickly prototype pages with existing or simple widgets and then refine them over time. Functional pages can be easily constructed in minutes (and hopefully in the future entirely via a drag-and-drop page creation tool within an application itself).

Surf now supports Theme based LESS CSS pre-processing and widgets are written to be completely theme-able. This allows functional pages to be have their design modified repeatedly over time without needing to throw away existing work and start over from scratch.

How Does it Work?

There have been numerous blogs over the past year that have described the work we've been doing - although none of them specifically refer to Aikau by name, the knowledge is already out there!

Essentially Aikau is powered by Surf and uses the Dojo AMD loader and widget templating capabilities to provide a basis for dynamic dependency analysis. Each JSON model is dynamically analysed for AMD modules and those modules themselves are then analysed for their dependent modules (and so on, and so forth) until a complete dependency 'layer' has been constructed for that page.

Surf caches module dependency relationships as well as page dependencies to ensure that only the minimum amount of analysis is done to maximise performance.

JavaScript Framework Ambivalence

Although Aikau makes heavy use of Dojo for the AMD loader and widget templating, it is by no means forces the exclusive use of Dojo. it extends the AMD paradigm to allow non-AMD dependencies to be easily referenced by widgets and is completely ambivalent to the JavaScript framework being used.

We have already made use of numerous other JavaScript frameworks and projects within the current suite of Aikau widgets including:

    • 'Legacy' Alfresco JavaScript code
    • YUI2
    • JQuery
    • ACE
    • JSON Editor Online

    Summary

    It's still early days, but we now have a framework and an initial set of widgets that make page development using Aikau a reality.  It's unlikely that Aikau will ever completely replace the existing Share implementation but it is intended to work in harmony with it as well as providing the infrastructure to quickly develop alternative Surf based Alfresco clients.

    The goal of this post is simply to allow us to talk about Aikau and for you to know what we're referring to!

    15 Comments
    blog_commenter
    Confirmed Champ
    Confirmed Champ
    […] my last blog post I revealed that “Aikau” was the project name for the updates we’ve been making to […]
    blog_commenter
    Confirmed Champ
    Confirmed Champ
    My Hawaiian is rusty. Can I get a phonetic spelling on this, please?
    ddraper
    World-Class Innovator
    World-Class Innovator
    @Jeff - mine is non-existent, but I'm reliably told that phonetically it's 'Eye-Cow' (that's what we've been going with anyway!)
    blog_commenter
    Confirmed Champ
    Confirmed Champ
    Hallo David,



    first of all I would like to say that I really appreciate your efforts making Share easier to customize.  Keeping methods short helps and is generally a good thing.



    Speaking about Alfresco extensibility really strikes a nerve for me. I frequently hit road blocks when I work on extensions - of various type and across all layers of the Alfresco stack.  I understand extensibility is a complex topic, but I think there are things which could be changed with little effort and a minimum risk.



    In the Java world for example, private and final modifiers tend to get in my way. Various methods (in Java and Javascript) begging for extensibility are way to long.  I personally think it is enough to say 'Beware !' instead of 'No way !'.



    As things stand today, I often go for the dirty, hacky (and usually much shorter) route to get things done.



    Thanks a lot for making a Share developers life easier

    Andreas
    ddraper
    World-Class Innovator
    World-Class Innovator
    @Andreas - thanks for your feedback, it's greatly appreciated.  It is definitely a tricky task to retrospectively fit customization to an existing codebase and also to integrate a new framework into an existing application (and it's especially challenging with JavaScript) but I think we're getting there!



    I'm hoping that Aikau will allow us to have different 'tiers' of customization... from simply applying 3rd party extension modules, to writing extension modules that manipulate a default model, to writing entirely new widgets. Each tier will require a varying level of ability but should hopefully be able to make customizing Share less of a challenge and hopefully avoid people needing to resort to the sort of hacks to which you refer.



    We're still a long way off achieving that completely - but hopefully we're on the right path!



    Regards,

    Dave
    blog_commenter
    Confirmed Champ
    Confirmed Champ
    […] recently committed some updates to the Alfresco Community SVN repository that enable some new Aikau page creation capabilities in Share. These changes are only currently available (at the time of […]
    blog_commenter
    Confirmed Champ
    Confirmed Champ
    […] may have seen one of Dave Draper’s recent blog posts introducing the new framework. Ole’s tutorial is the next step you should take in order to understand the framework and how […]
    blog_commenter
    Confirmed Champ
    Confirmed Champ
    […] will be coming for a future 5.0 release. Custom facet controls can be created using the flexible Aikau framework. Developers may be interested to know that this page is the first complete Share page to be […]
    blog_commenter
    Confirmed Champ
    Confirmed Champ
    […] La búsqueda simple incluye filtrado mediante facetas, acciones para los elementos resultantes y scroll infinito. Esta ha sido la primera página desarrollada por completo con el nuevo framework aikau […]
    blog_commenter
    Confirmed Champ
    Confirmed Champ
    […] The simple search includes filtering by facets, actions for the resulting elements and infinite scroll. This is the first web page completely developed using the new framework aikau […]