Download - 2011 05-jszurich
Ace:Browser based editor
Julian Viereck@jviereck
Fabian Jakobsajax.org
@fjakobs
Kevin DangoorMozilla
@dangoor
Code Editors
Our life is in the cloud... and our dev env?
We use desktop apps to build web apps?
Can’t we do better?
Yes - we can!
13.7 billion years ago
1983
230 million years ago 230,000 years ago
1770
2008 2009
MozillaSkywriter
2010
Ajax.orgAce2010
Ajax.org Cloud9 Editor(Ace)
• Fully featured
• Extensible
• Scalable
• Cross Browser
No Compromise
• we don‘t strive for almost as good
• we strive to be at least as good
• it‘s time for the web to take over
Cloud9IDE Demo
Ace Building Blocks
Renderer(View)
Editor(Controller)
Edit Session(Model)
LanguageMode
Document
SelectionKeyboardHandler
KeyboardHandler
Tech Details
Renderer
•DOM is used for drawing only
•no state in the DOM
•never read the DOM
Virtual Viewport
• rendering a full document in the DOM doesn‘t scale
• only render visible rows
..
..
....
..
...
.... . . ...
.
..
.
.
..
..
.
..
.. ..
.
.. . ..
..
.... . . .
.
Performance• Document size shouldn‘t matter
• Everything in the main thread should scale with the viewport size
BUT
• not everything does!
• We need web workers
Worker
Web WorkersMain JS Thread
Document....
..
.
.. . ..
..
.... . . .
JS ParserEdit Session
Mirror....
..
.
.. . ..
..
.... . . .
Ace Demo
Present
Present
• 30+ Contributors
• 677 Watchers, 148 Forks on Github
• 234 Pull Requests
• 17 Language modes
Future
• Code completion
• Code Navigation
• Outline View
• Documentation
Happy Coding!
@cloud9_editorhttp://ace.ajax.org
https://github.com/ajaxorg/ace
Photo Credits
• Big Bang http://www.flickr.com/photos/neychurluvr/4021590334/
• Mozilla Dinosaur http://www.flickr.com/photos/neychurluvr/4021590334/
• Bacon http://en.wikipedia.org/wiki/File:RawBacon.JPG
• Ben and Dion http://www.flickr.com/photos/franksvalli/5163228449/
• JSConf.EU http://blog.sinnerschrader.de/mt-static/support/themes/jsconf2009/lg_logo.png