[BUG]: Eliminate render-blocking CDN stylesheet for SocialShareButton in index.html

メンテナーはふだん 4 日以内に返信

評価

調査の方向性

説明

Bug Description

A Lighthouse performance audit on OrgExplorer reveals that the external stylesheet for SocialShareButton loaded from jsDelivr (https://cdn.jsdelivr.net/gh/AOSSIE-Org/SocialShareButton/src/social-share-button.css) is strictly render-blocking.

This synchronously pauses initial page rendering, delaying First Contentful Paint (FCP) and Largest Contentful Paint (LCP) by ~800 ms with an estimated rendering savings of 450 ms. Additionally, while index.html preconnects to api.github.com, it lacks resource hints (preconnect / dns-prefetch) for cdn.jsdelivr.net.

I have verified this behavior in index.html and would like to fix this. Could you please assign this issue to me?

Proposed Solution

• Add preconnect and dns-prefetch resource hints for https://cdn.jsdelivr.net in <head> to perform early DNS resolution and TLS handshakes.
• Load social-share-button.css asynchronously using the non-blocking rel="preload" as="style" onload="this.onload=null;this.rel='stylesheet'" pattern.
• Include a <noscript> fallback so the stylesheet loads reliably if JavaScript is disabled.
• This eliminates ~450–800 ms of critical render-blocking overhead on initial page load without modifying any React component logic.

Steps to Reproduce

1. Open https://orgexplorer.aossie.org/ in Google Chrome.
2. Open Chrome DevTools (F12) and navigate to the Lighthouse tab.
3. Select the Performance category and click Analyze page load.
4. Observe the warning under "Render-blocking requests":
   • ...src/social-share-button.css (cdn.jsdelivr.net) is flagged as render-blocking with an 800 ms duration and estimated savings of 450 ms.

Logs and Screenshots

Environment Details

• Affected File: index.html
• Browser: Google Chrome (Latest)
• Tool: Chrome DevTools / Lighthouse
• Branch: main

Impact

Medium - Feature works but has issues

Code of Conduct

• I have joined the Discord server and will post updates there
• I have searched existing issues to avoid duplicates

環境構築

はじめの一歩

1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
3. リポジトリをフォークし、ブランチを切って変更します。
4. issue 番号を参照したプルリクエストを送ります。

AOSSIE-Org/OrgExplorer のほかの issue

• [BUG]: Overview "Language Distribution" percentages are relative to the top-7 languages, not all repos

  対応中かも @Rohit270406 が今日担当しました。 オープン

  ⋯この Issue の問題を報告

  • 何か問題がありますか？

  • すでに着手されている
  • 初心者向けではない
  • 古い・無効
  • その他…
  • 送信 キャンセル
  bug

  難易度 2/5 1〜3時間 初心者へのやさしさ 76/100

  AOSSIE-Org/OrgExplorer#402 · コメント 1 件 · 2026年10月22日 に作成

  メンテナーはふだん 4 日以内に返信

• [BUG]: "Delete" PAT button is gated on the input field, so a saved token can't be removed when the field is empty

  オープン

  ⋯この Issue の問題を報告

  • 何か問題がありますか？

  • すでに着手されている
  • 初心者向けではない
  • 古い・無効
  • その他…
  • 送信 キャンセル
  bug

  難易度 2/5 1〜3時間 初心者へのやさしさ 88/100

  AOSSIE-Org/OrgExplorer#401 · 2026年10月22日 に作成

  メンテナーはふだん 4 日以内に返信

• [BUG]: Overview wrongly lists a successfully-loaded org as "could not be loaded" (case / duplicate)

  対応中かも @dhruvbit が今日担当しました。 オープン

  ⋯この Issue の問題を報告

  • 何か問題がありますか？

  • すでに着手されている
  • 初心者向けではない
  • 古い・無効
  • その他…
  • 送信 キャンセル
  bug

  難易度 2/5 1〜3時間 初心者へのやさしさ 82/100

  AOSSIE-Org/OrgExplorer#400 · コメント 1 件 · 2026年10月22日 に作成

  メンテナーはふだん 4 日以内に返信

• [BUG]: Top-repository scoring double-counts stars via watchers_count

  オープン

  ⋯この Issue の問題を報告

  • 何か問題がありますか？

  • すでに着手されている
  • 初心者向けではない
  • 古い・無効
  • その他…
  • 送信 キャンセル
  bug

  難易度 2/5 1〜3時間 初心者へのやさしさ 76/100

  AOSSIE-Org/OrgExplorer#399 · 2026年10月22日 に作成

  メンテナーはふだん 4 日以内に返信

• [BUG]: Governance "Issue Resolution Rate" counts pull requests as issues

  オープン

  ⋯この Issue の問題を報告

  • 何か問題がありますか？

  • すでに着手されている
  • 初心者向けではない
  • 古い・無効
  • その他…
  • 送信 キャンセル
  bug

  難易度 1/5 1時間未満 初心者へのやさしさ 86/100

  AOSSIE-Org/OrgExplorer#398 · 2026年10月22日 に作成

  メンテナーはふだん 4 日以内に返信

AOSSIE-Org/OrgExplorer の issue をすべて見る

似ている issue

• fix(ci): install resolve-config's dependencies in intake-triage refine-select before refine.mjs --select

  オープン

  ⋯この Issue の問題を報告

  • 何か問題がありますか？

  • すでに着手されている
  • 初心者向けではない
  • 古い・無効
  • その他…
  • 送信 キャンセル
  needs-triage

  難易度 2/5 1〜3時間 初心者へのやさしさ 76/100

  melodic-software/claude-code-plugins#9619 · 2026年10月24日 に作成

  メンテナーはふだん 1 日以内に返信

• Update Sidebar Navigation Label: Change "nav.code-explainer" to a Ai Code Explainer

  オープン

  ⋯この Issue の問題を報告

  • 何か問題がありますか？

  • すでに着手されている
  • 初心者向けではない
  • 古い・無効
  • その他…
  • 送信 キャンセル
  bug Frontend P2-medium UI UX

  難易度 1/5 1時間未満 初心者へのやさしさ 76/100

  Deepak3699/Ai_Mentor#427 · 2026年10月24日 に作成

  メンテナーはふだん 1 日以内に返信

• resource.reload() while params is in error switches the resource to 'idle' instead of retrying

  オープン

  ⋯この Issue の問題を報告

  • 何か問題がありますか？

  • すでに着手されている
  • 初心者向けではない
  • 古い・無効
  • その他…
  • 送信 キャンセル
  area: core

  難易度 2/5 1〜3時間 初心者へのやさしさ 78/100

  angular/angular#71585 · 2026年10月24日 に作成

  メンテナーはふだん 1 日以内に返信

• venn: a name that starts with set-, union-, text- or style- followed by a letter is a parse error

  オープン

  ⋯この Issue の問題を報告

  • 何か問題がありますか？

  • すでに着手されている
  • 初心者向けではない
  • 古い・無効
  • その他…
  • 送信 キャンセル

  難易度 2/5 1〜3時間 初心者へのやさしさ 82/100

  obsidianmd/pele#65 · 2026年10月24日 に作成

  メンテナーはふだん 3 日以内に返信

• `eleventyConfig.addDateParsing` callbacks can return invalid `DateTime`s

  オープン

  ⋯この Issue の問題を報告

  • 何か問題がありますか？

  • すでに着手されている
  • 初心者向けではない
  • 古い・無効
  • その他…
  • 送信 キャンセル
  needs-triage

  難易度 2/5 1〜3時間 初心者へのやさしさ 78/100

  11ty/buildawesome#4407 · リアクション 1 件 · 2026年10月24日 に作成

  メンテナーはふだん 1 日以内に返信

JavaScript の issue をもっと見る