docs(code-page): add 'apollo-shared-ws' JavaScript client

src/code/language-support/javascript/client/apollo-shared-ws.md

@@ -0,0 +1,55 @@
+---
+name: Apollo Shared Ws
+description: Share a single WebSocket connection across multiple browser tabs and windows for Apollo Client. Features built-in subscription deduplication via payload indexing to optimize network performance.
+github: sdev-buildz/apollo-state-sync/tree/main/packages/apollo-shared-ws
+npm: apollo-shared-ws
+tags:
+  - tools-and-libraries
+  - frontend
+---
+
+### 🗂️ Subscription Deduplication & Indexing
+
+- GraphQL Subscriptions are uniquely indexed by their payloads across all active browsing contexts—including browser tabs, windows, and iframes.
+- When a user opens multiple tabs, network load remains identical to having just a single tab open.
+- Making duplicate subscriptions across different UI components will not trigger extra network requests.
+
+<br/>
+
+### 📦 Installation
+
+```sh
+npm install apollo-shared-ws graphql-shared-ws
+```
+
+### 💻 Quick start
+
+```ts
+import { GraphQLWsLink } from "@apollo/client/link/subscriptions"
+import { ApolloClient, ApolloLink, InMemoryCache } from "@apollo/client"
+import { setupRestartSubscription } from "apollo-shared-ws"
+import { createSharedClient } from "graphql-shared-ws"
+import { authLink } from "./util/authLink"
+
+const wsLink = new GraphQLWsLink(
+  // use 'createSharedClient'.
+  createSharedClient({
+    url: "wss://localhost:443/api/graphql",
+    connectionParams: {
+      headers: {
+        authorization: "auth-token-1234",
+      },
+    },
+  }),
+)
+
+const apolloClient =
+  //  use setupRestartSubscription to enable subscription restarts.
+  //    wrap ApolloClient with setupRestartSubscription(...)
+  setupRestartSubscription(
+    new ApolloClient({
+      link: ApolloLink.from([authLink, wsLink]),
+      cache: new InMemoryCache(),
+    }),
+  )
+```

src/code/language-support/javascript/client/apollo-state-sync.md

@@ -0,0 +1,45 @@
+---
+name: Apollo State Sync
+description: Seamlessly synchronize and persist Apollo Client cache and reactive variables across multiple browser tabs and windows for a consistent user experience.
+github: sdev-buildz/apollo-state-sync
+npm: apollo-state-sync
+tags:
+  - tools-and-libraries
+  - frontend
+---
+
+## 💡 Why use it?
+
+Modern web apps often run across multiple browser tabs or windows within the same workflow. Without shared state synchronization, users can end up with inconsistent data:
+
+- logged in status differs across tabs
+- Data edited in one tab stays outdated in another until a manual refresh.
+- in-memory caches are inconsistent across tabs
+- app state resets unexpectedly when a tab is reopened
+
+<br/>
+
+## ✨ Features
+
+- Syncs Apollo Client's state (Apollo cache and reactive variables) across all browser tabs and windows.
+- Persists state across browser restarts and user sessions
+- Helps build multi-window and multi-tab apps without custom state plumbing
+
+<br/>
+
+## 🔌 API reference
+
+- 🚀 **Quick Start**: Jump into the [API Overview](https://github.com/sdev-buildz/apollo-state-sync/blob/6cd9a05467ade3a31ac0350aa9fe7cad3c3ae760/API_OVERVIEW.md) to get up and running in minutes.
+- 🤖 **Automated Migration**: Effortlessly transition from standard Apollo Client using the [Migration Bot](https://github.com/sdev-buildz/apollo-state-sync/blob/6cd9a05467ade3a31ac0350aa9fe7cad3c3ae760/README.md#-migration-automation).
+
+<br/>
+
+## 📽️ See it in Action
+
+[<img alt="demo video" width="240px" src="https://raw.githubusercontent.com/sdev-buildz/apollo-state-sync/refs/heads/main/assets/Shopping%20Site%20Example%20-%20Demo%20Thumbnail.png"/>](https://github.com/user-attachments/assets/18df5e73-f7a6-417f-8398-2bb8251ccc3e)
+
+<br/>
+
+### 🌐 Try the Live Demo
+
+You can access the live application here: https://sdev-buildz.github.io/apollo-state-sync/examples/posts