Fetch and render OG images for links on pages

[MrCoder]

It is an idea that we develop a plugin for DocuSaurus that automatically fetches and renders Open Graph (OG) images from external links included in markdown files.

Use case

Content is critical for our SEO and overall marketing success. A convenient way to include existing sequence diagram on pages/articles is useful.

We have said we will support one way to include diagram which is using code block like below:

```
A.method
```

With this one, it is easy to compose.

This proposal is for a different use case - to include an existing diagram from our diagram gallery. The extra benefit is that it can link back to the original diagram on our site which is useful to build an SEO network.

Proposed Functionality

1. Link Scanning: Automatically scan markdown files for links from our gallery during the build process.
2. OG Image Fetching: For each link, make an HTTP request to fetch the HTML content and parse it to extract the OG image URL (from og:image meta tags).
3. Image Storage: Download these images and include them in the build artifacts.
4. Image Rendering: Modify the page rendering logic to display these images alongside their respective links.
5. Performance Optimization: Implement caching mechanisms to prevent repeated downloads of the same image and consider image optimization for faster loading.
6. Error Handling: Robust error handling for scenarios where an OG image is not available or cannot be fetched.

[unimu-cic]

Do we need to store these images? Because the OG image is dynamically generated by LaraSite. We can do something like this to improve SEO:

md:
[![ZenUML | Diagram Title](http://zenuml.com/sequence-diagram/diagrams/1/og-image.jpg)](https://zenuml.com/sequence-diagram/diagrams/1)

render to👇

html:
<a href="https://zenuml.com/sequence-diagram/diagrams/1">
  <img alt="ZenUML | Diagram Title" src="http://zenuml.com/sequence-diagram/diagrams/1/og-image.jpg" />
</a>

So, we only need to care about:

• How to generate the image link for each code block, and the Editor also can reuse the diagram on the doc site
• Performance Optimization
• Error Handling

[MrCoder]

Is OG image always regenerated? We have added salt to the URL so that we always get the right OG image.