Skip to content

Add Open Graph and Twitter Card meta tags #18

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.

Sign up for GitHub

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

Draft
wants to merge 4 commits into
base: main
Choose a base branch
from
+36 −0
Draft

Add Open Graph and Twitter Card meta tags #18

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
0d4d00e
Initial plan
Copilot Oct 5, 2025
a67de66
Add Open Graph and Twitter Card meta tags to index.html
Copilot Oct 5, 2025
6556a19
Fix Open Graph and Twitter Card image URLs to use absolute URLs
Copilot Oct 5, 2025
7a4033d
Use relative image URLs with documentation for flexibility across dep…
Copilot Oct 5, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 36 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,42 @@
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta
name="description"
content="Interactive React performance examples and demos to help developers understand optimization techniques and patterns. Compare efficient and inefficient implementations side-by-side."
/>

<!-- Open Graph / Facebook -->
<meta property="og:type" content="website" />
<meta
property="og:url"
content="https://stackblitz.com/~/github.com/JasonMore/react-performance-examples"
/>
<meta property="og:title" content="React Performance Examples" />
<meta
property="og:description"
content="Interactive React performance examples and demos to help developers understand optimization techniques and patterns. Compare efficient and inefficient implementations side-by-side."
/>
<!-- Note: og:image uses a relative path for flexibility across deployments.
For production, consider using an absolute URL and a custom social media image. -->
<meta property="og:image" content="/vite.svg" />
<meta property="og:site_name" content="React Performance Examples" />

<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image" />
<meta
name="twitter:url"
content="https://stackblitz.com/~/github.com/JasonMore/react-performance-examples"
/>
<meta name="twitter:title" content="React Performance Examples" />
<meta
name="twitter:description"
content="Interactive React performance examples and demos to help developers understand optimization techniques and patterns. Compare efficient and inefficient implementations side-by-side."
/>
<!-- Note: twitter:image uses a relative path for flexibility across deployments.
For production, consider using an absolute URL and a custom social media image. -->
<meta name="twitter:image" content="/vite.svg" />

<link
href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css"
rel="stylesheet"
Expand Down