Computer engineer. Working as a web developer since 2000.
After seeing the file browser, configuration and memory consumption of the most popular code editors for Mac, in this second part I’m going to compare code detection and syntax highlighting for Ruby and Markdown.
Rails file detection
For the editor to highlight syntax, it must first correctly detect the file we open. I haven’t always come across this case, and now I’m going to check it out.
When you open a Ruby on Rails controller in TextMate 2, it is detected as a Ruby file. This means that the framework’s expressions are not highlighted, such as require_dependency. Changing the file type to Ruby on Rails solves this problem.
But what happens when we close the file and reopen it? TextMate 2 now assigns the Ruby on Rails type not only to this file but to the other .rb files as well, until we change it again. In this case, there will be no difference between the two modes when opening a Ruby file, but it does help when opening a controller, model, etc., in Ruby on Rails mode.
Sublime Text 3 also detects the file as a Ruby type. Switching to Ruby on Rails solves the problem. But when you close and re-open the file, it does not remember the type manually selected. This forces us to select the type manually each time or to configure it explicitly.
Atom has the opposite behavior. Somehow it knows that it’s a Rails project, and it opens all the .rb files in this mode. Even if you select Ruby and re-open the file, it still opens as Ruby on Rails. I imagine it can be customized in the settings.
Unfortunately, Visual Studio Code does not have the Ruby on Rails file type, so all files must be opened in plain Ruby mode. Doing a quick search, I couldn’t find any extension to add the Rails file type.
In Brackets the same thing happens: there is only a file type for Ruby files. I couldn’t find an extension to add one for Rails either.
The color scheme of the code is very personal. In my case, I have worked for a few years with the TextMate 2 Twilight scheme. In this editor, you can find many other themes and install them.
How easy is it to install Twilight in other editors?
In Sublime Text 3 it is as simple as installing it from the package control. In the color scheme selector, it appears as Twilight+.
In Atom you search for the theme from the preferences, and then in the theme options, it appears as Twilight in the syntax theme.
After a search in Visual Studio Code, I also found this theme. After the installation, it appears in the color theme selector as Twilight.
Finally, in Brackets I have also found the theme Twilight and several more related, but after trying them all, none is the same as the original.
Embedded Ruby code highlighting
An essential part of web development with Ruby on Rails are templates. Within these, it is convenient that HTML and embedded Ruby code can be quickly distinguished.
In TextMate 2, by default, the Ruby code has a highlighted background, so although it may not look particularly attractive, it is swift to see.
I noticed that the other editors don’t offer this highlighting out of the box, but let’s see what happens after changing the color scheme to Twilight.
Sublime Text 3 does highlight the embedded Ruby code, although more subtly, detecting the file as HTML (Rails).
Atom detects the file as HTML (Ruby – ERB), but it does not highlight the Ruby code. Also, the file tab looks weird.
Visual Studio Code detects the file as html.erb, and it does not highlight the Ruby code either.
Finally, Brackets detects it as Embedded Ruby, but it does not highlight the embedded Ruby code.
Markdown has become a widely used text format for documentation files within the source code, such as Readme files.
I’m going to open the Readme file of the project and see how each editor shows it by default.
In TextMate 2 the text has syntax highlighting, previewing some things like the size of titles. It is also easy to navigate them from the bottom of the editor.
There is no preview in Sublime Text 3, and you can also navigate easily using the Goto Symbol feature.
Atom is the same case, but its feature to navigate through symbols fades out the contents of the file. It’s another way to do it; I don’t like it.
Visual Studio Code does not preview the size of titles either, and its Go to Symbol in File function is very similar to Sublime Text 3.
In the case of Brackets, there is no preview. And although I searched for a “go to symbol” feature, I haven’t found any.
In the next and last article of this series I write about Project search and Open quickly features.
Also published at https://davidmles.medium.com/code-editors-for-mac-ii-5bee24ef2cee
Create your free account to unlock your custom reading experience.