While building https://hn.boxpiper.com/, a re-imagined version of Hacker News for this decade, I stumbled upon the idea to present stories in the card-image layout where a user can see the relevant open graph image of an article. Why? Because a visual representation of an article increases the chance of visiting that link.
To that, I followed a simple process. First I fetch the HTML version of the page using AXIOS, https://www.npmjs.com/package/axios. Once I fetched this successfully, I used https://metascraper.js.org/#/ which has an extensive set of modules that helps in fetching the relevant meta tags from the given HTML.
Once I have the open graph images, I gave preference to the Twitter meta image to the open graph because Twitter has a much stricter rule w.r.t the resolutions. The better the resolutions, the better the thumbnails.
Visit https://hn.boxpiper.com/ and enjoy the re-imagined version of Hacker News.