Elytra Blog

The simple RSS Reader. This blog publishes release notes, engineering and design details.

Elytra v2.5 for macOS Monterey now available

Banner: Elytra running on macOS Monterey on the 2021 Macbook Pro

Elytra is now optimised and available for macOS Monterey. It also includes performance and usability optimisations for macOS Big Sur. You can download it directly from here or from the App Store.

This is the first release with a modern and cutting-edge foundation which focuses on reliability, stability and ease of adding new features in future releases.

If you feel generous and have a couple of minutes, please leave a review on the App Store. It makes a huge difference for me. Thank you in advance.


Along with the macOS release, a small iOS release is also available which brings the most recent fixes to the iOS app and brings the two on parity.


Elytra's feed view with an article open Elytra's feed view with an article open with the New York font applied to titles. Elytra's search view in focus Elytra's with a Youtube video open in the article reader

New

  • New UI for the New & Rename Folder prompt
  • Improved UI for Feed Info UI
  • Safari Extension to add new feeds to Elytra directly from the webpage you’re browsing.
  • Quick Notes support (only on macOS Monterey)
  • Added a new sync method to also sync added and deleted feeds on sync
  • Added a new Portrait Lock preference under miscellaneous settings
  • Added support for tables in articles
  • New and improved article list view. It renders twice as fast now and uses less power overall
  • Added a new setting to the Feed Settings: You can now toggle full-text fetching for feeds. When you open an article from that feed, the full-text content will be automatically loaded.
  • Added a “Enable Push Notifications” toggle under Preferences > General. You will only see it if Push Notifications are not already enabled on that device. For cross-device sync, it is recommended you turn this on.
  • New Options for Feeds: Open Articles in the Browser. This is useful for feeds where full-text extraction fails.

Improvements

  • Improved loading speed for the Unread and Today feeds.
  • The panel sizes (Sidebar and Articles List) are now persisted across app launches.
  • New Photos Browser
  • Improved handling of adding new feeds via the url scheme
  • If you add multiple folder widgets, you can configure each one with a unique folder (latest macOS only).
  • Improved error messages across the app. The app will now display error messages directly from the API’s error
  • Added delete and info swipe actions to the search results for feeds
  • Improved scrolling performance in the article reader
  • New Appearance customisation UI in the article reader
  • Improved visuals for the folder row if a feed is being dropped onto it
  • Improved dragging states for feeds and articles
  • The sidebar now maintains the folders expansion state across app launches
  • Added the cmd + G (cmd + shift + G for backwards) shortcut for navigating to the next article search result
  • Improved sync and timeline loading performance for users with several filters

Fixes

  • Fixed an issue where changing the font-size from the Preferences window to any value other than System would keep system sizing enabled
  • Fixed an issue where closing the main window would prevent the window from being opened again
  • Fixed an issue which caused the macOS tint color to not be properly set for all views
  • Foxed an issue where the window’s size and position would not be maintained with window manager apps installed and running
  • Fixed an issue where marking some articles as read failed if they were recently synced on to the device
  • Fixed an issue across all platforms that could sometimes cause a crash on launch when available system memory is low
  • Fixed an issue with the title view in the articles list being hidden after scrolling
  • Fixed an issue when swiping back from the article reader when the bars are hidden to cause the layout to get janked
  • Fixed an issue with the new sync not updating the feed’s folder structure if one already exists
  • Fixed an issue that caused a crash when changing from light to dark mode and the article reader was open
  • Fixed a crash that would sometimes occur when opening an article with Lists containing multiple line breaks at the beginning of the paragraph
  • Fixed a bug with importing OPML Files with invalid/incorrect format
  • Fixed an issue where the feed settings would not be loaded correctly on app launch
  • Fixed an issue which caused Feeds only re-sync to fail which also caused background sync to fail sometimes. This could potentially cause feeds metadata to get wiped

Designing Elytra for macOS Big Sur – Part 1

Big Sur has been the biggest change to macOS since I started using it back during the OS X 10.6 (Snow Leopard) days. We’ve gone from the “hyper aqua” to the subdued and flatter aqua look and finally into the iOS-esque Big Sur design language.

In part 1, we’ll go through the app’s interface from top to bottom, left to right. So as is the case, let’s begin with the toolbar.

Toolbars

In Big Sur, Apple has completely changed the toolbar, not only in terms of its visual design, but also how it behaves, its sizing, allowing content to flow under it (just like iOS’ Navigation Bars), monochrome icons and sticky sections.

macOS Big Sur - Photos.app in the foregroup, Mail.app in the background

The new toolbars in some contexts are even invisible. They are part of the content as seen in Photos.app.

Here’s a quick comparison between Elytra for macOS Catalina and macOS Big Sur.

Top: Elytra running on macOS Catalina. Bottom: Elytra running on macOS Big Sur

I’ve included fullscreen screenshots on purpose, because Big Sur really enables deferring all UI real-estate to the content if you so desire. In Elytra’s case, an app for reading written content, this was a default choice.

Big Sur also enables pinned or sticky sections for the toolbar, so each vertical column of the app has its own set of actions. While v2.1.3 (first version, odd, I know!) shipped with the toolbar items as you can see, they are definitely set to change in an upcoming release to bring more powerful features to the app.

With macOS taking care of so many things for me, Mac Catalyst became the obvious choice for Elytra right from the get go.

The Sidebar

Full height column, translucent materials, collapsible sections,searchbars, automatic light and dark states; I could keep going on. The new frameworks supplied by Apple to compose such sidebars have been the best thing since their Compositional Layouts framework. And the new sidebars rely on this Compositional Layouts framework to enable a lot of these things automatically.

They are however not without their faults. They do lack some features which native AppKit apps have but I’m sure they’ll all arrive in due time as Apple Engineers continue to reduce the gap between macOS and iOS, or I switch to using SwiftUI and everything renders natively per host OS.

Articles List

This was a tricky one to get right. Up until late October, this is how the Articles List looked
Elytra's original interface with incorrect styling for the Article's list

There are a few reasons why this is completely wrong on macOS.

  1. The list item completely ignores the new insets which native apps on Big Sur use.
  2. The list ignores the additional padding required by such lists.
  3. The list also ignores the inter-cell padding.

All of this is noted by Apple in the “What’s new in macOS” HIG document.

By using Apple’s supplied values, we get a list which is much more comfortable to read and glance at.

Elytra's UI with corrected styling for the Article's list

So even if you’re using Mac Catalyst to bring your iPadOS App to macOS, I urge you spend some time studying the HIG (and not just read it) so you’re familiar with what your users are going to expect from your app.

The Article Reader

This is what you’re here for. This is why I built Elytra. The article reader in Elytra renders all text using Apple’s TextKit framework, all images directly supplied to UIImageView subclasses, most videos directly supplied to the AVPlayerView, and all code rendered just like text.

Groups of consecutively appearing images are converted into horizontally scrolling galleries with page counters.

Customisation of the reader view by setting up your preferences for font-size, line-spacing, separate header and paragraph fonts.

It’s all there, it all works just as you have come to expect coming from the iOS and iPadOS apps. But it wasn’t as simple as enabling the magical “Optimise for Mac” option in Xcode.

To make sure things work correctly on both iOS and macOS, I had to redo a few bits of the rendering engine to make sure text renders sharp on modern Macs and renders exactly as one would expect it to.

Here’s how the Scale Interface to match iPad variant looked:

Elytra's UI with the Scale interface option enabled Elytra's UI with the Scale interface option enabled

Everything was tiny. Everything looked off. Nothing looked like it it deserved to be on macOS. When working on the macOS Catalina build, I used a small hack to scale all type by 1.3x and even that didn’t look all that great.

So to make sure everything is up to the mark and deserving of the Mac-assed Mac App title, I reworked a good chunk of the rendering engine which also ended up benefiting the iOS and iPadOS apps by improving the rendering performance.

My iPhone 12 first impressions article in Elytra on macOS Big Sur

I also took the opportunity to enable better rendering for CJK and Indic languages.


In part 1, we looked at the app from a distance, assessed it from left-to-right, went over each column and briefly discussed each section. In part 2, I hope to dig into some technical details of bringing an iPadOS App to macOS via Catalyst.