We've got a brand-new website, redesigned from the ground-up

https://oxygenupdater.com/

In our "Oxygen Updater in 2022" article we touched upon the new website undergoing testing, and on 5th March 2022, we finally deployed it to production. Our goal from the beginning was to achieve two things: modernize the design/layout (including a dark theme), and incorporate a page specifically for our articles (including an RSS feed). Along the way we also decided to make all its content completely static, since it didn't make sense to query our database on every request (our content doesn't change often). A fully-static website is great for SEO purposes, and will surface our articles in search engines. This helps project growth.

Coupled with Cloudflare's brilliant caching, this massively reduces server load (not that we had server issues, but still). Relevant parts of the app's API have also been updated to bypass the database if the correct static data (JSON) already exists. Serving a file directly is always more performant than going through a DB, because it would access the filesystem anyway, and there'd be additional overhead of the engine involved.

Behind the scenes in our backend, this static data (JSON & HTML) is automatically updated when needed — e.g. if we make edits to an article, the backend will write JSON+HTML for the article-related pages once, and all subsequent requests for it would serve these files directly. The rest of the website stays the same; no need for multiple unnecessary DB accesses (in the old system, the backend saved it only to DB, and each request required creating a connection to the database & retrieving the saved information).

Comparisons (desktop)

⇈ Old • New ⇊

Note: above screenshots are desktop-only. The old website looked much worse on mobile; new website follows responsive design so it'll look great on any screen size (open it in your mobile browser to see how it looks for you).

Problems with the old website:

1. Design looked dated & jarring (plus no support for dark themes at all)
2. Text didn't explain the app's purpose properly; sounded like a generic promotion
3. Screenshots didn't reflect what the actual app looked like (they're of a very old version)
4. Images cycled through different screens without any context about that screen
5. Supported device list only had names, and regions weren't grouped together
6. Privacy Policy page wasn't a page at all, was a PDF (which sometimes downloaded instead of showing it in-browser)

How the new website solves these problems:

1. Refreshed design while keeping the general layout same (better UX for people who were already used to the old website)
2. In-depth explanations of what the app does & why it exists; has OSS, ads, and third-party disclosures right at the top
3. Images are taken from the latest app version (v5.6.0 at the time of writing), and they'll be kept up-to-date if anything changes
4. Screenshots in the device frame are synced with content on the right-hand side (as you scroll down), somewhat like a journey through the app
5. List groups devices by region (Global, EU, India) and also shows its image; collapsed by default to save space
6. https://oxygenupdater.com/privacy/ is a well-structured page with transparent information — also shows the last update date; in the future it'll include a short summary of changes (if any)

The biggest improvement though, is the new articles page and its corresponding RSS feed (convenient way to stay informed without needing to enable notifications). Other publishers occasionally link to our articles (sometimes we're the first ones to report on things) and they've had to use the app's API link to do so. That link is meant specifically for the app, and looks really bad on anything outside of it. Now, our articles are on the website as well and this will significantly move our reporting forward. API links pasted in a browser automatically redirect to the website-page for the best experience.

Having an RSS feed nets another benefit: we're listed on Google News, so you don't need to keep the app installed if you've kept it only for our articles. Mark our publication as a favourite if you want it to be easily accessible within GNews.

Please browse through the new website, you can email us at [email protected] with any suggestions you may have. Alternatively, you can also open up a GitHub discussion or join our Discord server if you'd like to keep the conversation public.

If you're a developer, the website's code is open-source with a BSD 3-Clause Clear License. It's fairly straightforward, we're using

• Next.js as the static-site generator,
• Preact as the frontend framework (it has advantages over React, although Next.js doesn't work perfectly with it), and
• Sass with TailwindCSS for styling (not Bootstrap; clunky as hell)