本文へ移動
cccskills
無料GitHub で公開

wp-rocket-frontend-architecture

Use this skill when changing admin JavaScript, CSS, or HTML/Twig templates in WP Rocket.

インストール方法を見る

含まれるファイル(1)

  • SKILL.md1.3 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

WP Rocket — Frontend Architecture

Guidelines for JavaScript, CSS, and template changes in WP Rocket's admin UI.

Core principles

  • No jQuery — use native DOM APIs only.
  • No inline event handlers (onclick, onchange, etc.) — use addEventListener.
  • No unsafe innerHTML assignments — use textContent or createElement/appendChild.
  • Use event delegation where appropriate (admin pages can load content dynamically).

Admin settings UI

  • Settings page templates live in views/.
  • JS for the settings page lives in assets/js/.
  • Use wp_localize_script to pass PHP data to JS — never inline <script> blocks with data.
  • Nonces must be localized — never hardcoded.
  • New JS entry points must be registered and enqueued through a Subscriber.

AJAX / REST

  • Use native fetch with the localized nonce for REST calls.
  • Use wp.ajax for legacy AJAX (admin-ajax.php) if already present in the area.
  • Always handle errors explicitly — no silent failures.

Structural expectations

  • JS files live under assets/js/.
  • CSS files live under assets/css/.
  • No new global variables — use module patterns or data attributes to share state.

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

challenge

無料

Adversarially review a grooming spec before implementation starts. Finds hidden risks, unvalidated assumptions, and missing dependencies. Standalone entry point for the challenger agent.

日本語の概要は準備中です。原文の説明を表示しています。

wp-media/wp-rocket7672026年10月14日 更新

Check a change against WordPress.org plugin rules and PHPCS standards.

日本語の概要は準備中です。原文の説明を表示しています。

wp-media/wp-rocket7672026年10月14日 更新

docs

無料

Update developer-facing documentation to reflect code changes on the current branch. Runs as an inline skill inside backend-agent and frontend-agent (step 2.5 of the internal sequence) after implementation and before DOD. Receives the explicit list of changed files from the implementation agent. No-op if no public API changes occurred.

日本語の概要は準備中です。原文の説明を表示しています。

wp-media/wp-rocket7672026年10月14日 更新

dod

無料

Run the Definition of Done checklist for the current wp-rocket branch and report PASS/WARN/FAIL with evidence. Two modes: layer 1 (self-correction inside backend-agent / frontend-agent — resolves FAILs before handoff) and layer 2 (independent orchestrator gate — fresh perspective after handoff). Pass layer: "1" or layer: "2" when invoking.

日本語の概要は準備中です。原文の説明を表示しています。

wp-media/wp-rocket7672026年10月14日 更新

e2e

無料

Run a basic E2E behavioral probe — one primary scenario smoke test for the grooming step.

日本語の概要は準備中です。原文の説明を表示しています。

wp-media/wp-rocket7672026年10月14日 更新

groom

無料

Groom a single GitHub issue — produce an implementation spec and optionally post the grooming summary as a GitHub comment. Standalone entry point for the grooming-agent.

日本語の概要は準備中です。原文の説明を表示しています。

wp-media/wp-rocket7672026年10月14日 更新

wp-media のスキルをすべて見る

このスキルの問題を報告する