Redesign main page: industries, customers, LLM visibility#50
Merged
irinanazarova merged 16 commits intomasterfrom Apr 14, 2026
Merged
Redesign main page: industries, customers, LLM visibility#50irinanazarova merged 16 commits intomasterfrom
irinanazarova merged 16 commits intomasterfrom
Conversation
- Add /features page showcasing AnyCable capabilities with feature grid - Add /compare hub with comparison pages for Action Cable, Pusher, and Ably - Add /customers showcase page with case studies and industry breakdown - Add /learn hub with learning paths, documentation links, and resources - Update navigation header with new page links - Add comprehensive SCSS styling for all new pages following existing design system - Maintain consistent red accent (#f64343) and clean, modern aesthetic
PRICING STRUCTURE (Monthly-first PLG approach): Self-Hosted: - Open Source: Free forever - Pro License: $99/month or $990/year (save 17%) Managed (plus.anycable.io): - Free: $0 - up to 100 connections - Starter: $29/mo - up to 1K connections - Pro: $99/mo - up to 10K connections (Most Popular) - Scale: $299/mo - up to 50K connections - Enterprise: Custom pricing KEY FEATURES: - Monthly pricing with annual discounts (17% savings) - Clear upgrade path from free to enterprise - Interactive pricing calculator comparing AnyCable, Pusher, self-hosted - Comprehensive feature comparison table - Detailed FAQ section (8 common questions) - Enterprise CTA with gradient background - Toggle between monthly/annual billing - Real-time cost estimates based on connections PLG BEST PRACTICES IMPLEMENTED: ✓ Start free (no credit card) ✓ Usage-based scaling ✓ Self-serve signup ✓ Clear value progression ✓ Transparent pricing ✓ Easy upgrade path ✓ Calculator shows competitive advantage Technical: - New /pricing page with dedicated route - pricing.ts with calculator logic - pricing.scss with responsive design - Updated header navigation link
- Update Self-Hosted Pro from $99/mo to $130/mo ($108/mo annual) - Reframe Enterprise section to focus on source-available licensing - Highlight main Enterprise value: extending AnyCable with custom Go modules - Update Enterprise description to emphasize customization capabilities
- Fix HTML parsing error: change '< 100ms' to '< 100ms' - This was breaking Vite's HTML parser and preventing proper page loading
- Move pricing.ts to js/components/pricing-calculator.ts - Import pricing calculator in main index.ts - Change pricing page to use /index.ts instead of /pricing.ts - This ensures proper module loading and stylesheet import
- Fix line break in Handlebars dochead partial call - Multiline attributes can break Handlebars parsing
- Add Ably pricing tiers to calculator logic - Display Ably as 4th comparison option in calculator - Calculate and show savings compared to Ably - Update pricing estimates based on Ably's pricing page
Main page: - Replace use-cases section with industry showcase (Healthtech, Fintech, Field Services & IoT, Communities, And more) featuring 36 companies with descriptions, links, and clickable "learn more" modals - Add Doximity podcast quote from On Rails podcast - Update "Why AnyCable?" text with new positioning (framework-agnostic, delivery guarantees, any backend) - Redesign resources section using two-halves layout with doc icon cards, video thumbnails with play overlays, and newsletter list - Add company modal with logos, detail text, and case study links - Floating animation on hero logo - Smooth scroll with header offset for anchor navigation Navigation: - Header links now anchor to page sections (Features, Customers, Pricing, Docs, Resources) instead of separate pages - Remove underline on header link hover New content: - Socket.io comparison page (/compare/socket-io) with reliability focus - AnyCable vs Socket.io blog post draft - llms.txt for LLM discoverability - 7 new Evil Martians blog posts added to blog index - Compare index updated with Socket.io, Action Cable, Pusher/Ably, Centrifugo, Laravel Reverb, Django Channels comparisons Removed pages: - /features, /learn, /pricing, /pro, /customers (consolidated to main) - /compare/ably, /compare/pusher, /compare/action-cable Assets: - 25 new company logos (favicons + SVGs for Doximity, CoinGecko, Agero) - JS and Laravel doc icons - Company modal JS Styling: - Consistent border grid across all two-halves sections - Standardized button styles (primary, secondary, tab active states) - Footer background darkened (#1a1a1a), Discord link removed - Smooth scrolling with scroll-margin-top for sticky header
- Add Python/FastAPI code snippet to about-slide tabs (real httpx code) - Add FAQPage JSON-LD with 6 questions (what is AnyCable, pricing, multi-backend, HIPAA, vs Socket.io, vs Pusher/Ably) - Add SoftwareApplication pricing offers (OSS, Managed, Pro, Enterprise, Consulting) - Add "when you don't need AnyCable" honesty section to llms.txt - Fix broken pricing link in llms.txt (/pricing → /#pricing) - Add "HIPAA and SOC2 compliant" to Healthtech industry description
|
|
Remove features.scss, customers.scss, learn.scss, pricing.scss, pricing-calculator.ts, and WEBSITE_IMPROVEMENTS_SPEC.md — all from pages that were added and then removed during development.
palkan
requested changes
Apr 13, 2026
Member
palkan
left a comment
palkan
left a comment
There was a problem hiding this comment.
I like it 👍
Let's just fix some bugs:
- Videos — kinda small and barely readable (and the first one has a cover image with the top padding?)
(They look fine on mobile)
- The customer popup always appears on the left side of the screen—is it intentional?
Screen.Recording.2026-04-13.at.17.05.32.mov
- Laravel and JS logos—what are they?)
Should be smth like this (oops, we have a bug—Rails is now JS 😁):
- One suggestion regarding the customer tiles—let's add a link to case studies right on the tile ("Read case study" or smth like that); right now you can only find them if you click, and since most don't have case studies, it's not clear that they even exist.
5*) Maybe, we should not list that many customer per section? And add logos to some of them (like, 2 bigger tiles with logos and 4 smaller ones per section?).
- Videos: switch to single-column layout with 16:9 aspect-ratio + object-fit cover so YouTube's 4:3 hqdefault thumbnails crop cleanly; bump title/speaker font sizes for readability on desktop - YouTube thumbnails: use hqdefault.jpg (always available) instead of maxresdefault.jpg which 404s for older videos - Framework icons: replace hand-drawn approximations with official SVGs (Rails, Laravel, JavaScript, Hotwire) - Customer popup: center properly via absolute positioning — parent .popup never gets display:flex so justify-content was never applied - Customer tiles: inject a "Read case study →" span on tiles with a case study; click opens the case study URL directly (window.open with stopPropagation), while clicking elsewhere on the tile still opens the company popup as before
palkan
approved these changes
Apr 14, 2026
Member
palkan
left a comment
palkan
left a comment
There was a problem hiding this comment.
Awesome! All good now. Almost: can we update "Read the case study" to smth like "Watch bla-bla" for Wealthbox (Yjs talk)?
Wealthbox's case study is a YouTube talk (JP Camara's Yjs talk at SF Ruby 2025), not a written article. Add optional data-case-study-cta attribute on tiles that need different CTA text and use it for Wealthbox. Default remains "Read case study →".
Remove /compare (hub) and /compare/socket-io from this PR to finish that work separately. Also drops the compare.scss import from index.scss and the /compare link from llms.txt. The compare pages are preserved on the compare-pages branch for follow-up work.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Refresh the main page content and design. All content lives on a single page with anchor navigation, plus new LLM-visibility surfaces.
Note: the /compare hub and /compare/socket-io pages were split off to the
compare-pagesbranch so that work can finish independently.Changes vs production
Main page — industries & customers section (replaces use-cases)
Five two-halves blocks — Healthtech (9 companies), Fintech (5), Field Services & IoT (8), Communities (7), And more (7) — with 36 customer companies total. Each company card is clickable and opens a modal with logo, description, and case study link (where available). Tiles with a case study also show a direct "Read case study →" link (or "Watch the talk →" for Wealthbox's Yjs talk) that opens the content in a new tab without triggering the modal.
Doximity podcast quote from the On Rails podcast after Healthtech.
Main page — "Why AnyCable?" section
Updated copy: delivery guarantees, 10K connections, any backend. New Python/FastAPI code tab alongside Pub/Sub, Ruby, JS/TS. Standardized tab button styles.
Main page — resources section (redesigned)
Same two-halves layout as the rest of the page:
Main page — hero & navigation
New: LLM visibility
/llms.txt— comprehensive content for LLM discoverabilityBlog index
7 new Evil Martians blog posts added (Dec 2025 — Nov 2024).
Other
/proredirect removedAddressed review feedback
From @palkan's review comments:
aspect-ratio: 16/9+object-fit: coverso YouTube's 4:3hqdefault.jpgthumbnails crop cleanly (no more top/bottom black bars); bumped title to 17px and speaker to 14px for readability.maxresdefault.jpg(often 404s for older videos → gray placeholder) tohqdefault.jpg(universally available)..popupusesdisplay: inherit(not flex), sojustify-content: centernever applied. Fixed by positioning the modal absolutely withleft: 50%+transform: translate(-50%, …).data-case-study. Clicking the link opens the case study directly in a new tab; clicking anywhere else still opens the popup. Wealthbox's CTA reads "Watch the talk →" since it links to JP Camara's Yjs talk.Split off to separate branch
The
/comparehub and/compare/socket-iopages (pluscompare.scss) are on thecompare-pagesbranch and will be finished/merged separately.How to review
yarn dev→localhost:5173