Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature/optimize media #826

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

QuantGeekDev
Copy link

@QuantGeekDev QuantGeekDev commented Jan 17, 2024

  • optimized .jpg and .png files to webp
  • optimized .gif files to mp4
  • create VideoAsGif client-side component
  • add VideoAsGif to mdx components at [slug]/page.js
  • renamed media paths to new paths
  • Fixed issue where media wasn't loading on ios chrome and safari until the page is reloaded

Why a new component? Unlike gifs which can be embedded in markdown as images, videos are not supported by Markdown. I tried to keep it as close to your style as possible with minimum changes in the way you write your posts.

So now whenever you want to add a an mp4 file in the future but you want it to behave as gif, use this code directly in your .md files without any additional changes or imports:

<VideoAsGif src="./nameOfFile.mp4" ariaLabel="Accessible image description"/>

Copy link

vercel bot commented Jan 17, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
overreacted.io ✅ Ready (Inspect) Visit Preview Jan 17, 2024 1:03am

@QuantGeekDev
Copy link
Author

@gaearon Hey :) Curious to know if you have any thoughts on this PR - does this accomplish the goal of optimizing media?

@want-to-sleep
Copy link

want-to-sleep commented Oct 28, 2024 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants