Comparison of JavaScript-based source code editors
This article provides basic feature comparison between some of the JavaScript-based source code editors available today. This article is not all-inclusive or necessarily up-to-date.
Overview
| Site | Latest version | Style / Clone of | Cost (US$) | Software license | Open source | Browser compatibility | |
|---|---|---|---|---|---|---|---|
| CodeMirror | Home Page | 0.60, 2008-12-29 | Emacs / regular textarea | Free | BSD-like | repository | Firefox 1.5+, Internet Explorer 6+, Safari 3+, Opera 9.52+, Chrome[1] |
| CodePress | dead home page, Demo, SourceForge | 0.9.6, 2007-09-26 | Microsoft Visual Studio | Free | LGPL | Yes | ? |
| CodeTextArea | Home page, Demo, Experimental demo | Microsoft Visual Studio | Free | Yes | ? | ||
| ECCO | Home page | abandoned | Microsoft Visual Studio | Free | no downloads | ? | |
| EditArea | Home, Demo | 0.8.1v2, 2009-04-19 | Microsoft Visual Studio | Free | LGPL | Yes | IE 6 & 7 & 8, Firefox 1.5 & 2 & 3, Safari 3.x & 4, Opera 9, 9.5, 9.6 and Chrome 1 & 2[2] |
| Helene | Home, Demo | 0.9, unknown release date | Microsoft Visual Studio | Free | GPL | Yes | |
| Markitup | Home, Demo | 1.1.3, 2008-09-15 | markup editor, no syntax highlight | Free | MIT, GPL | Yes | |
| 9ne | Home Page | ? | emacs | Free | GPL | Yes | |
| jsvi | Home Page | ? | vi | Free | GPL | Yes | |
| CodeIDE | Home Page | ? | Microsoft Visual Studio | ? | ? | No | |
| MDK-Editor | Home Page | 2.10, 2008 | Microsoft Visual Studio | Depends on the use | Dual license | Code is readable | tested to work on: IE 6, 7 - Firefox 2, 3 - Chrome |
List of features
Feature testing was performed with Firefox 3.0.6 against the current demo version, and results may not match those in other browsers or downloadable versions.
| CodeMirror | CodePress | CodeTextArea | EditArea | Helene | markItUp! | MDK-Editor | |
|---|---|---|---|---|---|---|---|
| Implementation | nestable full parsers | pattern-based parser | parsers | ||||
| Syntax highlight | JS, CSS, XML, mixed mode, PHP, SPARQL; can be extended with new parsers | limited mixed mode: HTML+JavaScript (no CSS), PHP+HTML (no JavaScript or CSS), Java, Perl, SQL | only keywords | only one language at a time: PHP, CSS, Javascript, Python, HTML, XML, VB, C, CPP, SQL, Pascal, Basic, Brainf*ck | PHP | No | mixed mode: PHP+HTML+JavaScript+CSS, single-mode: PHP, Javascript, CSS, XML; extensible |
| Syntax checking | basic; more comprehensive for PHP [1] | No | No | HTML, JavaScript (using JSLint) | |||
| Indent, new line keeps level | Yes | very limited | No | Yes | N/A (can't press Enter) | No | Yes |
| Indent, syntax | Yes | No | No | ||||
| Indent, selected block | either automatically, or block-level indent/unindent | No | yes, including Shift+Tab | yes, including Shift+Tab and using context menu | |||
| Bracket matching | Ctrl+[ after the bracket; no angle bracket matching | an implementation exists with mouse-hover bracket matching[citation needed] | Ctrl+B; no angle bracket matching | No | matching bracket ([{<>}]) always highlighted | ||
| XML matching tag highlight | No | No | Yes | ||||
| Code folding | No | No | No | No | No | No | No |
| Code snippets | example using API | type 'for' or 'if' then Tab | No | Yes | No | Yes | JavaScript |
| Code suggestion | No | No | yes[citation needed] | No | CSS, HTML; in progress: JavaScript) | ||
| Toggle syntax highlight on/off | No | last example in demo | N/A | textmode | |||
| Keyboard shortcuts | basic | Yes | All key combos (except F1 in IE7) can be bound to shortcuts | ||||
| Line numbers | demo | Yes | Yes | Yes | Yes | No | supports mouse selection |
| Search & replace | via API | No | toolbar button | Ctrl+H | |||
| Spell checking | browser-based | browser-based | none | browser-based | none | browser-based | No |
| Toolbar | example using API; demo | No | Yes | No | Yes | kind of, API tools on the testsite[citation needed] | |
| Visual styling | font-type and font-size | 5 styles to choose from, having 2 font-sizes | |||||
| Undo/Redo | Yes | Yes | Yes | Infinite diff-based, with visual update[citation needed] | |||
| Usability | Initial parse is slow, further performance is independent of document size | new text sometimes syntax highlighted only after going out of the viewable area | No PageDown/PageUp | text ghosting if syntax highlight enabled | can't type Enter | no documentation |
TODO: Other aspects
- Add Bespin http://labs.mozilla.com/projects/bespin/
- What size files do these editors handle best
- How many dependencies (files) does each require? When compressed, what is the minimum download size in kilobytes?
- Tabbed editing?
- Javascript architecture (prototype, functional, or closure-based)
- How responsive is each library (with and without a large file loaded)? (Not sure how to measure this yet.)
- How long is the delay before syntax-highlighting occurs on new text?
Extensibility features
- Feature plugins
- Interface languages (English, French, etc.)
- Syntax highlighting plugins
- Bracket completion plugins
- Language snippet plugins
- Code suggestion plugins
Offspring projects
Below is a list of projects based on each engine.
CodeMirror powered
- Google's API playground
- r3, a template management engine developed by Yahoo!
- FireRainbow - JavaScript syntax highlighting for Firebug
- Freebase's Acre IDE
- Google Earth KML sampler
- Eloquent JavaScript's console
- A cool tutorial about the <canvas> element
- An online IDE for the Orc programming language
CodePress powered
- WebDevStudio - web IDE. Demo.
- Ultimate CMS Tool by Martin Kirk - [Currently only Firefox is supported]
- Extplorer by Soeren Eberhardt
- ModX CMS plugin
- WordPress plugin
- Typo 3 plugin
- CMS Drupal integration
- Codepress plugin for jQuery
- Ext plugin
EditArea powered
- F->IT, browser-based online JavaScript FTP client