As of version 0.9.4, Arctype now ships standard with Monaco. Query editing is the most important function of any SQL client, and a good query editor should:
- Have code formatting and syntax highlighting functionality
- Support keyboard shortcuts for common tasks
- Handle large blocks of code without substantial performance losses
And most importantly, a query editor must be responsive.
We replaced DraftJS with Monaco to improve the editor experience and address performance concerns. Monaco is more of a drop-in component and you get a lot more out of the box. Our Draft editor code was over 2500 lines, while our current Monaco editor is only 434.
DraftJS is flexible—kind of like an editor construction kit—and really meant for rich text editors. Because it’s so flexible, we were able to continually implement features on top of Draft to build our query editor, but our implementation created technical debt as it grew and performance issues began to creep in.
Through this transition to Monaco, we’ve added more developer-focused features to the query editor—most notably, multi cursors:
Similar to this gif, you can now activate multi cursors (Cmd+Alt+Up) to simultaneously edit multiple lines in your queries. Simply put, implementing multi cursors in DraftJS would have incurred additional unwanted technical debt. Switching to Monaco enabled us to support this feature and others, such as easily accomplishing tasks like searching within queries (Cmd+F) and commenting out text (Cmd+/):
As always, please do not hesitate to give us feedback and submit feature requests on our Discord!
0.9.4 Release Notes
Improvements:
- Search within Queries (Cmd + F)
- Comment selected text (Cmd + /)
- Multi cursor (Cmd + Alt + Up)
- Tables show up in Quick Find (Cmd + K)
- Auto format (Cmd + Alt + F)
- Auto indent on new line, tab/shift tab to block indent
Bugfixes:
- Row numbers no longer cut off in Results
- Cursor stays in place on auto format
- Switch back to page 1 of results on Query change
- Save query while it’s running
- Edit folder name immediately after creation
Check out all the new shortcuts and equivalent Windows and Linux keys here.
