Xopus Application Framework
-
Upload
jady-yang -
Category
Technology
-
view
883 -
download
0
description
Transcript of Xopus Application Framework
![Page 2: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/2.jpg)
Introduction
Everyone likes JavaScript!
JavaScript is a very popular client-side language because:
I It is a simple language.
I It is a very dynamic language.
I It is very closely tied to the DOM.
I It is the only thing out there.
![Page 3: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/3.jpg)
Introduction
Everyone likes JavaScript!
JavaScript is a very popular client-side language because:
I It is a simple language.
I It is a very dynamic language.
I It is very closely tied to the DOM.
I It is the only thing out there.
![Page 4: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/4.jpg)
Introduction
Everyone likes JavaScript!
JavaScript is a very popular client-side language because:
I It is a simple language.
I It is a very dynamic language.
I It is very closely tied to the DOM.
I It is the only thing out there.
![Page 5: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/5.jpg)
Problem observation
JavaScript is very well-suited for dynamic web pages.
Xopus is not a web page, but an application.
We observe some problems with the language:
I There are only functions and objects.
I No modules, classes, name spacing, explicit dependencies, etc.
I No help to structure your program.
I No such thing as ‘idiomatic JavaScript’.
![Page 6: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/6.jpg)
Existing JS Frameworks
AFLAX AJAX.NET AJAXGear Toolkit AJFORM AjaxAC AjaxRequestAjaxcaller Bajax Behaviour CPaint DOM-Drag Dojo ToolkitEngine FlashObject Flexible AJAX JSPkg MochiKit Moo.FXNifty Corners OSFlash Flashjs PAJAJ PEAR:: HTML AJAX PlexToolkit Prototype RSLite Rico SACK SAJAX Sardalya SarissaScriptaculous Solvent Symfony TOXIC Taconite ThyApi TibetWZ DradDrop WZ jsGraphics XAJAX XHConn XOAD ZK ZephyrZimbra dp.SyntaxHighlighter jQuery jWic libXmlRequestmoo.ajax overLIB qForms qooxdoo 1
We focus on program architecture not browser integration.
1from: http://edevil.wordpress.com/2005/11/14/javascript-libraries-roundup/
![Page 7: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/7.jpg)
Solving the problem
Luckily JavaScript is very dynamic, why not create us a paradigmourselves?
This presentation describes:
I how we have created an ‘object oriented’ framework.
I how we could keep this framework to be pure JavaScript.
I how this framework can help us structure our programs.
I how Xopus 4 uses this framework.
![Page 8: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/8.jpg)
Framework
The framework supports:
I Writing modules in an OO ‘extended subset’ of JS.
I Hierarchically structuring programs into packages.
I Some forms of program verification.
I Making dependencies explicit.
I Dependency resolution.
I Consistent file-system layout.
And:
I Server side compilation to flattened form.
I Serving the client efficient and possibly obfuscated code.
I Even more!
![Page 9: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/9.jpg)
Framework
The framework supports:
I Writing modules in an OO ‘extended subset’ of JS.
I Hierarchically structuring programs into packages.
I Some forms of program verification.
I Making dependencies explicit.
I Dependency resolution.
I Consistent file-system layout.
And:
I Server side compilation to flattened form.
I Serving the client efficient and possibly obfuscated code.
I Even more!
![Page 10: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/10.jpg)
Example
Package("com.xopus.code" );
Import("com.xopus.code.Food" );Extends("com.xopus.code.Animal" );
Class(function Monkey (name) { this.name = name; },function getName () { return this.name; },function favorite () { return new Food("banana" ) ; },Static, function kind () { return "chimp" ; }
);
![Page 11: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/11.jpg)
Example - compiled
(function (Food,Animal) {
var Monkey = comxopuscodeMonkey = function Monkey (name) { this.name = name; };Monkey.prototype.Monkey = Monkey;var Monkey prototype = Monkey.prototype;
Monkey prototype.getName = function Monkey getName () { return this.name; };Monkey prototype.favorite = function Monkey favorite () { return new Food("banana" ); };Monkey.kind = function Monkey kind () { return "chimp" ; };
for (var method in Monkey.prototype)Monkey.prototype[method]. class = Monkey;
for (var prop in Animal.prototype)if (Monkey.prototype[prop])
Monkey.prototype[Identifier({Animal:1}) + "$" + prop] = Animal.prototype[prop];else
Monkey.prototype[prop] = Animal.prototype[prop];
}).apply(this, [comxopuscodeFood,comxopuscodeAnimal]);
![Page 12: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/12.jpg)
Example - construction
(function (Food,Animal) {
var Monkey =comxopuscodeMonkey =function Monkey (name) {this.name = name;
};
Monkey.prototype.Monkey = Monkey;var Monkey prototype = Monkey.prototype;...
}).apply(this, [comxopuscodeFood,comxopuscodeAnimal]);
![Page 13: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/13.jpg)
Example - methods
Monkey prototype.getName =function Monkey getName () { return this.name; };
Monkey prototype.favorite =function Monkey favorite () { return new Food("banana" ); };
Monkey.kind = function Monkey kind () { return "chimp" ; };
for (var method in Monkey.prototype)Monkey.prototype[method]. class = Monkey;
![Page 14: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/14.jpg)
Preserving stacktrace
![Page 15: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/15.jpg)
Example - inheritance
for (var prop in Animal.prototype)if (Monkey.prototype[prop])
Monkey.prototype[Identifier({Animal:1}) + "$" + prop] =Animal.prototype[prop];
elseMonkey.prototype[prop] = Animal.prototype[prop];
![Page 16: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/16.jpg)
Compilation
I Server side compilation (currently) uses SpiderMonkey.
I Compilation entirely written in the JS framework.
I Uses reflection, only possible compile time.
I Compiler extensions for profiling, coverage, dependencyvisualization.
http://localhost/xopus/loader/test.html
console.dir(Loader.modules.map);
![Page 17: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/17.jpg)
Compilation
I Server side compilation (currently) uses SpiderMonkey.
I Compilation entirely written in the JS framework.
I Uses reflection, only possible compile time.
I Compiler extensions for profiling, coverage, dependencyvisualization.
http://localhost/xopus/loader/test.html
console.dir(Loader.modules.map);
![Page 18: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/18.jpg)
![Page 19: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/19.jpg)
Modules
The framework has support for:
I Fully qualified package names.
I Regular classes.
I Interfaces and abstract classes.
I Methods, put on prototype.
I Constructors, always the first method.(mandatory, constructor name defines class name)
![Page 20: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/20.jpg)
![Page 21: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/21.jpg)
Dependencies
The framework also has support for:
I Implementing interfaces.
I Extending (possibly multiple) other classes.
I Static decoration of other classes.
I Dynamic decoration of instances.
No full checks on interface implementation yet, should be possible.
![Page 22: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/22.jpg)
Annotations
Methods can be annotated with additional information:
I Public, Private, Protected, Static.
I Continuation, Test, Deprecated, API.
I Anonymous static functions are special: class constructors.
Annotations can be used for:
I Documentation.
I Parametrize compilation.
I For runtime reflection.
![Page 23: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/23.jpg)
Unit testing
Package("com.xopus.test.lang.js" );Extends("com.xopus.code.dev.testing.TestCase" )Tests("com.xopus.code.lang.js.ArrayUtil" )Class(
function ArrayUtilTest() { this.TestCase(); },Static, function () { new ArrayUtilTest().start(); },Test, function last(){
var obj = {};var arr = [1, 2, 3, obj];this.assertTrue("last() should return the last value in the array",arr.last() === obj);
});
![Page 24: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/24.jpg)
![Page 25: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/25.jpg)
Demo
I Uses runtime Test annotation.
I Can run entire packages - like com.xopus.*
I Mac mini automatically tests everything.
http://localhost/xopus/tester/runner/runner.html?modules=com.xopus.test.lang&profiling=true
![Page 26: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/26.jpg)
![Page 27: Xopus Application Framework](https://reader035.fdocuments.us/reader035/viewer/2022062514/5593f0a41a28abfa068b4597/html5/thumbnails/27.jpg)
Conclusion
Advantages:
I More consistency, more structure
I Framework for abstraction.
I Framework for analyses.
I No runtime overhead.
Disadvantages:
I Code you debug not the code you write.
I Minor compile-time overhead.
I Requires server side machinery.