Astro Server Island Detector Connector for AI agents.
1 live capability
Verify Astro component hydration and SSR strategies.
Waiting for input…
Why people use Astro Server Island Detector
Astro Server Island Detector stops broken hydration
With this MCP, you simply pass your code to your agent. It instantly pulls out every island and its strategy, so you can verify your configuration in seconds.
What Vinkius changes
You get instant validation for your Astro component configurations.
Use it from Claude, ChatGPT, Cursor or another AI client you already have.
One account · 5,900+ Connectors
- Real-world use case 01
Broken Hydration Debugging
A developer notices a component isn't interactive.
- Real-world use case 02
Code Review Automation
During a PR review, you use your agent to scan new JSX files for any accidental changes to Astro island directives.
- Real-world use case 03
SSR Strategy Validation
You're implementing complex streaming SSR and need to confirm that all components are using the correct server:defer settings.
Complete set · 1capability
The complete Astro Server Island Detector capability set.
These are the exact actions your AI can choose when you ask it to work with Astro Server Island Detector.
01
1 capability in this set.
Part of 1 available through Astro Server Island Detector.
- 01 Capability
Detect islands
Scans an HTML snippet to find Astro islands. It identifies the specific components and their associated directives.
Set up in minutes
One URL. Then ask Astro Server Island Detector to work.
Claude and ChatGPT only need the Connector URL. Copy it once, add it in settings, and use Astro Server Island Detector from the conversation.
Choose your client
Live previewAdvanced clients IDE · CLI
Claude · Web + desktop
Connector URL · ready to paste
Streamable HTTPhttps://edge.vinkius.com/vk_preview_c84U9zq1ua9numF4y9Ta4iIRfQ8UOQIWhV7czCIO/mcp - Step 01
Open Connectors
In Claude Web or Claude Desktop, open Settings and choose Connectors.
- Step 02
Add the URL
Choose Add custom connector, name it Astro Server Island Detector, and paste the URL above.
- Step 03
Turn it on in chat
Select +, open Connectors, and enable Astro Server Island Detector for the conversation.
ChatGPT · Web + desktop
Connector URL · ready to paste
Streamable HTTPhttps://edge.vinkius.com/vk_preview_c84U9zq1ua9numF4y9Ta4iIRfQ8UOQIWhV7czCIO/mcp - Step 01
Open MCP settings
On desktop, open Settings and MCP servers. On web, open your workspace app or connector settings.
- Step 02
Add the URL
Choose Add server with Streamable HTTP, or create a custom MCP app, then paste the Astro Server Island Detector URL.
- Step 03
Save and start
Save the connection and enable Astro Server Island Detector in your conversation. Desktop may ask you to restart once.
Cursor · IDE configuration
Advanced setup
{
"mcpServers": {
"astro-server-island-detector": {
"url": "https://edge.vinkius.com/vk_preview_c84U9zq1ua9numF4y9Ta4iIRfQ8UOQIWhV7czCIO/mcp"
}
}
}- Step 01
Open MCP Settings
Press Cmd+Shift+P (macOS) or Ctrl+Shift+P (Windows/Linux) → search "MCP Settings"
- Step 02
Add the server config
Paste the JSON configuration above into the mcp.json file that opens
- Step 03
Save the file
Cursor will automatically detect the new Connector
- Step 04
Start using Astro Server Island Detector
Open Agent mode in chat and ask: "Using Astro Server Island Detector, help me...". 1 tools available
VS Code Copilot · IDE configuration
Advanced setup
{
"mcpServers": {
"astro-server-island-detector": {
"url": "https://edge.vinkius.com/vk_preview_c84U9zq1ua9numF4y9Ta4iIRfQ8UOQIWhV7czCIO/mcp"
}
}
}- Step 01
Create MCP config
Create a .vscode/mcp.json file in your project root
- Step 02
Add the server config
Paste the JSON configuration above
- Step 03
Enable Agent mode
Open GitHub Copilot Chat and switch to Agent mode using the dropdown
- Step 04
Start using Astro Server Island Detector
Ask Copilot: "Using Astro Server Island Detector, help me...". 1 tools available
Windsurf · IDE configuration
Advanced setup
{
"mcpServers": {
"astro-server-island-detector": {
"url": "https://edge.vinkius.com/vk_preview_c84U9zq1ua9numF4y9Ta4iIRfQ8UOQIWhV7czCIO/mcp"
}
}
}- Step 01
Open MCP Settings
Go to Settings → MCP Configuration or press Cmd+Shift+P and search "MCP"
- Step 02
Add the server
Paste the JSON configuration above into mcp_config.json
- Step 03
Save and reload
Windsurf will detect the new server automatically
- Step 04
Start using Astro Server Island Detector
Open Cascade and ask: "Using Astro Server Island Detector, help me...". 1 tools available
Cline · IDE configuration
Advanced setup
{
"mcpServers": {
"astro-server-island-detector": {
"url": "https://edge.vinkius.com/vk_preview_c84U9zq1ua9numF4y9Ta4iIRfQ8UOQIWhV7czCIO/mcp"
}
}
}- Step 01
Open Cline MCP Settings
Click the Connectors icon in the Cline sidebar panel
- Step 02
Add remote server
Click "Add Connector" and paste the configuration above
- Step 03
Enable the server
Toggle the server switch to ON
- Step 04
Start using Astro Server Island Detector
Ask Cline: "Using Astro Server Island Detector, help me...". 1 tools available
Claude Code · Terminal command
Advanced setup
claude mcp add astro-server-island-detector --transport http "https://edge.vinkius.com/vk_preview_c84U9zq1ua9numF4y9Ta4iIRfQ8UOQIWhV7czCIO/mcp"- Step 01
Install Claude Code
Run npm install -g @anthropic-ai/claude-code if not already installed
- Step 02
Add the Connector
Run the command above in your terminal
- Step 03
Verify the connection
Run claude mcp to list connected servers, or type /mcp inside a session
- Step 04
Start using Astro Server Island Detector
Ask Claude: "Using Astro Server Island Detector, show me...". 1 tools are ready
Where the request belongs
Work Astro Server Island Detector can move forward.
Frontend engineers and web developers building high-performance sites with Astro's islands architecture.
Astro Developer
Audits complex JSX snippets to ensure server-side rendering is configured correctly.
Web Performance Engineer
Checks that component strategies won't break streaming or hydration during production.
QA Automation Engineer
Uses the capability to verify that new code changes haven't introduced invalid island directives.
Build the capability set
Add more capabilities.
Each Connector adds new actions and data without changing how you work.
Browse Connectors
CSS Class Usage & Collision Analyzer
Identify orphaned, missing, or colliding CSS classes in your project.
Heading Structure Validator
Validates HTML heading hierarchy, keyword presence, and semantic density.
URL Structure Analyzer
Evaluate web URLs for SEO health, analyzing path depth, keyword relevance, and parameter noise.
Canonical Checker
Identify the authoritative URL version and detect SEO duplicate content risks.
BuiltWith Tech Lookup
Universal website technology intelligence. detect CMS, analytics, and frameworks via AI.
Fluxguard
Monitor website changes, track visual differences, and receive alerts via AI agents with Fluxguard.
Bring your own AI
Change the model, client or framework. Keep Astro Server Island Detector connected.
-
Claude -
ChatGPT -
Gemini -
Cursor -
VS Code -
Windsurf -
ZCode -
Cline -
Zed -
Continue -
Kiro -
Roo Code -
Zencoder -
Goose -
Void -
Augment Code -
Amp -
Qodo -
Tabnine -
Pieces -
Sourcegraph Cody -
JetBrains -
Warp -
Amazon Q -
Antigravity -
BoltAI -
Raycast -
Jan -
LM Studio -
AnythingLLM -
Open WebUI -
Msty -
Cherry Studio -
LibreChat -
TypingMind -
Chorus -
5ire -
n8n -
LangChain -
LlamaIndex -
CrewAI -
Vercel AI SDK
Before you connect
Questions about Astro Server Island Detector.
The practical details behind the request, access and result.
How does Astro Server Island Detector help with hydration errors?
It identifies components using incorrect directives that cause hydration to fail, allowing you to fix them before they reach production.
Can I use Astro Server Island Detector to check my JSX files?
Yes. You can provide any HTML or JSX snippet to your agent, and it will scan for all active Astro islands.
Does Astro Server Island Detector work with server:defer?
Yes, it specifically looks for the server:defer and server:only directives to ensure your streaming SSR is configured correctly.
What happens if my code has an invalid Astro directive?
The MCP will scan the snippet and flag any unrecognized or invalid configuration attempts that could break your component architecture.
Is Astro Server Island Detector useful for large codebases?
It is extremely useful for auditing specific snippets or files during development to ensure no misconfigurations have been introduced.
What does this MCP server do?
It scans HTML or JSX snippets to find Astro components using server:defer or server:only directives, providing a list of detected islands and their strategies.
How can I use the detection capability?
You can call the detect_islands capability by providing an html_snippet containing your Astro component code.
Does it support both defer and only strategies?
Yes, the engine is specifically designed to detect both server:defer and server:only directives within your code snippets.
One connection away
Give your agent a direct line to Astro Server Island Detector.
Connect Astro Server Island Detector once. Keep it beside 5,900+ managed Connectors when the next task needs more.
Explore every Connector No credit card required · Free tier available