Simple RSS, Atom and JSON feed for your blog
After reading “Date and Time with a Static Site Generator” by Jim Nielsen, I realised I used an incorrect date format on my RSS feed. Unfortunately, not only date was invalid, but the whole feed was a mishmash of different specifications. All fixed now!
I spent a few hours digging into the specifications of RSS, Atom and JSON feeds, and as a result, I have a simple copy/paste example that you can adapt for your blog. I also created a simple tool that allows you to generate a feed in all three formats and compare them.
Multiple formats
There are three dominant feed specifications: RSS, Atom and JSON Feed. It is a common practice to serve multiple formats as I do on my blog (RSS and JSON Feed). Thanks to HTTP Archive dataset, we can determine the breakdown of feed formats on the web.
- 58% of the HTTP Archive sample use any feed type
- 50% of the HTTP Archive sample use RSS
- 8% of the HTTP Archive sample use Atom
- <1% of the HTTP Archive sample uses JSON Feed
Thank you, Rick Viscomi, for helping me set up HTTP Archive dataset on the GCP BigQuery and crafting some magical SQL queries.
RSS 2.0 — blog feed example
RSS (Really Simple Syndication) is the oldest feed format, with its first version released in 1999. The latest version, 2.0, was released in 2009. Despite its limitations, it is still the most popular feed format.
<link type="application/rss+xml" rel="alternate" href="https://example.com/rss.xml" title="Example - RSS Feed" />
<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Example website title</title>
<link>https://example.com</link>
<description>Example website description.</description>
<atom:link href="https://example.com/rss.xml" rel="self" type="application/rss+xml" />
<item>
<title>Post one</title>
<link>https://example.com/posts-one</link>
<description>Post one content.</description>
<guid isPermaLink="true">https://example.com/posts-one</guid>
<pubDate>Mon, 22 May 2023 13:00:00 -0600</pubDate>
</item>
<item>
<title>Post two</title>
<link>https://example.com/posts-two</link>
<description>Post two content.</description>
<guid isPermaLink="true">https://example.com/posts-two</guid>
<pubDate>Mon, 15 May 2023 13:00:00 -0600</pubDate>
</item>
</channel>
</rss>
Atom — blog feed example
Atom was developed as an alternative to RSS to address problems concerning date formats, internationalisation, and modularity. It became popular due to its adoption by many Google products.
<link type="application/atom+xml" rel="alternate" href="https://example.com/atom.xml" title="Example - Atom Feed" />
<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
<id>http://example.com/</id>
<title>Example website title</title>
<updated>2023-05-22T13:00:00.000Z</updated>
<author>
<name>John Doe</name>
</author>
<link href="https://example.com/atom.xml" rel="self" type="application/rss+xml" />
<subtitle>Example website description.</subtitle>
<entry>
<id>https://example.com/posts-one</id>
<title>Post one</title>
<link href="https://example.com/posts-one"/>
<updated>2023-05-22T13:00:00.000Z</updated>
<summary type="html">https://example.com/posts-one</summary>
<content type="html">Post one content.</content>
</entry>
<entry>
<id>https://example.com/posts-two</id>
<title>Post two</title>
<link href="https://example.com/posts-two"/>
<updated>2023-05-15T13:00:00.000Z</updated>
<summary type="html">https://example.com/posts-two</summary>
<content type="html">Post two content.</content>
</entry>
</feed>
JSON Feed — blog feed example
JSON Feed is the newest format, released in 2017 and last time updated in August 2020. It is based on JSON compared to XML-based RSS and Atom. Due to its simplicity, it is gaining quick adoption by client applications.
<link type="application/feed+json" rel="alternate" href="https://example.com/feed.json" title="Example - JSON Feed" />
{
"version": "https://jsonfeed.org/version/1.1",
"title": "Example website title",
"home_page_url": "https://example.com",
"feed_url": "https://example.com/feed.json",
"description": "Example website description.",
"items": [
{
"id": "https://example.com/posts-one",
"url": "https://example.com/posts-one",
"title": "Post one content.",
"content_text": "Post one content.",
"date_published": "2023-05-22T13:00:00.000Z"
},
{
"id": "https://example.com/posts-two",
"url": "https://example.com/posts-two",
"title": "Post two content.",
"content_text": "Post two content.",
"date_published": "2023-05-15T13:00:00.000Z"
}
]
}
I built a thing
Looking at the blobs of text doesn’t help us understand the differences between the formats. So I built the feed-generator.netlify.app to help you with that. It’s a simple tool that allows you to generate a feed in all three formats and compare them. At this point, it serves as a simple use case for generating a feed for a blog, but I plan to add more fields and make it more universal in the future.
I used this little web app as an opportunity to learn the basics of SolidJS. The documentation for this framework is fantastic, and I highly recommend Solid JS Crash Course Tutorial by The Net Ninja on YouTube.
Helpful resources
- The RSS 2.0 Specification
- The Atom Syndication Format Specification
- The JSON Feed Version 1.1 Specification
- RSS and Atom Feed validator
- JSON Feed validator
Interesting to know that RSS is so much more popular than Atom.
Given that Atom is apparently the better format, did you ever consider choosing it over RSS?
Btw, your two
<link rel="alternate" />elements (one for RSS, one for JSON) have the sametitleattribute, so it's not possible to distinguish between the two feeds based only on the titles.Nah. My motivation is to support the most bleeding edge JSON, and the best supported RSS. Atom is in between so I am also in between 🤷♂️
I will change titles for my RSS links. Good point Matias! Thank you!
Just wanted to ask you what RSS Reader you use and how you stay up to date. I found some useful stuff in your blog posts. Thanks alot
I personally use Reeder by Silvio Rizzi but another option that I would consider if you don't want to spend money for it is NewNewsWire. Both of them are really amazing options.
I honestly think feed should be in JSON format by default as it is a popular format and widely supported now a days. I built a very basic CMS to run my blog site and included the RSS feed (/feed). Seems like I would have to make some changes again to include the JSON feed. Thinking of using "/feed/rss" and "/feed/json" to separate them. On a personal level, I would prefer JSON over XML any day. I just don't like that fact that I would have to add them both!
Yeah I agree that JSON feeds are superior to XML, but XML has been with us for a while, and it is not going to be as easy to change it at this point. JSON feeds are still relatively new.
Thanks for writing this, very informative - and that little feed generator app is so handy! Overall I think JSON is so much nicer to work with.
No problemo, I am glad you found it helpful :)
Hi again, am I right in thinking that for RSS and ATOM you would need to escape the HTML content for characters such as ' " <> &? or else place it inside something like this:
Does JSON Feed require the same escaping or have a CDATA equivalent for characters such as '"<> when added to "content_html"?
It would be nice if there was just a single spec at this stage so novices like me could understand it all a bit better :)
If I'm honest with you, also don't know. I do a poor job at formatting of my own json feed. One day I will figure it out, but today is not the day. Good luck tho.
No worries, just thinking out loud here, was curious how it all worked. I do think < and > are both fine in JSON Feed with no need to escape them, not sure about other characters though.