DEV Community

Cover image for Periodic Table of Web APIs
James
James

Posted on • Updated on • Originally published at wwwperiodictable.surge.sh

Periodic Table of Web APIs

Screen Shot 2020-12-07 at 8.11.48 PM
Screen Shot 2020-12-07 at 8.44.18 PM
See it in full, clickable glory
Improve it by sending a pull request

If you open the full table, it has links to guides to learn some of the APIs.

Please like and unicorn if this post informed you! Thanks.

Top comments (3)

Collapse
 
calinzbaenen profile image
Calin Baenen

I'm guessing it has some organization to it, like the real periodic table. How is this table indexed?

Collapse
 
crazypython profile image
James • Edited

The columns are organized left-to-right by the date an API in that column was first implemented.
The rows are organized by the date they were first proposed.

The first row represents technologies that still work, but are superseded or obsoleted by newer technologies.
The second-to-last row is deprecated or abandoned APIs. These may have been implemented before and removed, or only partly implemented.
The last row is proprietary or vendor-specific APIs. These only ever worked in one browser.

The darkness and lightness represents the browser support of an API.
The redness represents how active an API's proposal or specification is.

One part that is incomplete is the links:

The date should link to the specification, which defines the API.
The element abbreviation should link to something that demonstrates what the API can do, such as a demo, playground, or reference manual.
The element details should link to where you can learn the API.

Collapse
 
crazypython profile image
James

What elements is your website made of?

Mine is made of C2D, Es, Svg, Css, and Ls.