LotusGuild/cinny
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf(router): lazy-load Lobby/Explore/Inbox routes; fix spoiler aria-pressed initial state

Browse Source 
Lobby, Explore/FeaturedRooms/PublicRooms, Inbox/Notifications/Invites are
now lazy-loaded via React.lazy so they only enter the bundle when navigated
to. Main bundle: 2547 kB → 2472 kB (gzip 637 → 618 kB).

Spoiler aria-pressed was initialised to false (revealed); changed to true
so the spoiler starts hidden, matching CSS logic (aria-pressed=true →
color:transparent).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Lotus Bot
2026-05-21 16:14:08 -04:00
parent 0d3eabb884
commit 528e2a48fc
2 changed files with 18 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/Router.tsx
+17 -10
View File
@@ -46,11 +46,11 @@ import { ClientBindAtoms, ClientLayout, ClientRoot } from './client';
import { Home, HomeRouteRoomProvider, HomeSearch } from './client/home';
import { Direct, DirectCreate, DirectRouteRoomProvider } from './client/direct';
import { RouteSpaceProvider, Space, SpaceRouteRoomProvider, SpaceSearch } from './client/space';
import { Explore, FeaturedRooms, PublicRooms } from './client/explore';
import { Notifications, Inbox, Invites } from './client/inbox';
import { setAfterLoginRedirectPath } from './afterLoginRedirectPath';
import { Room } from '../features/room';
import { Lobby } from '../features/lobby';
import { WelcomePage } from './client/WelcomePage';
import { SidebarNav } from './client/SidebarNav';
import { PageRoot } from '../components/page';
@@ -70,6 +70,13 @@ import { HomeCreateRoom } from './client/home/CreateRoom';
import { Create } from './client/create';
const CreateSpaceModalRenderer = React.lazy(() => import('../features/create-space').then(m => ({ default: m.CreateSpaceModalRenderer })));
const SearchModalRenderer = React.lazy(() => import('../features/search').then(m => ({ default: m.SearchModalRenderer })));
const Explore = React.lazy(() => import('./client/explore').then(m => ({ default: m.Explore })));
const FeaturedRooms = React.lazy(() => import('./client/explore').then(m => ({ default: m.FeaturedRooms })));
const PublicRooms = React.lazy(() => import('./client/explore').then(m => ({ default: m.PublicRooms })));
const Notifications = React.lazy(() => import('./client/inbox').then(m => ({ default: m.Notifications })));
const Inbox = React.lazy(() => import('./client/inbox').then(m => ({ default: m.Inbox })));
const Invites = React.lazy(() => import('./client/inbox').then(m => ({ default: m.Invites })));
const Lobby = React.lazy(() => import('../features/lobby').then(m => ({ default: m.Lobby })));
import { getFallbackSession } from '../state/sessions';
import { CallStatusRenderer } from './CallStatusRenderer';
import { CallEmbedProvider } from '../components/CallEmbedProvider';
@@ -238,7 +245,7 @@ export const createRouter = (clientConfig: ClientConfig, screenSize: ScreenSize)
element={<WelcomePage />}
/>
)}
<Route path={_LOBBY_PATH} element={<Lobby />} />
<Route path={_LOBBY_PATH} element={<React.Suspense fallback={null}><Lobby /></React.Suspense>} />
<Route path={_SEARCH_PATH} element={<SpaceSearch />} />
<Route
path={_ROOM_PATH}
@@ -255,7 +262,7 @@ export const createRouter = (clientConfig: ClientConfig, screenSize: ScreenSize)
<PageRoot
nav={
<MobileFriendlyPageNav path={EXPLORE_PATH}>
<Explore />
<React.Suspense fallback={null}><Explore /></React.Suspense>
</MobileFriendlyPageNav>
}
>
@@ -270,8 +277,8 @@ export const createRouter = (clientConfig: ClientConfig, screenSize: ScreenSize)
element={<WelcomePage />}
/>
)}
<Route path={_FEATURED_PATH} element={<FeaturedRooms />} />
<Route path={_SERVER_PATH} element={<PublicRooms />} />
<Route path={_FEATURED_PATH} element={<React.Suspense fallback={null}><FeaturedRooms /></React.Suspense>} />
<Route path={_SERVER_PATH} element={<React.Suspense fallback={null}><PublicRooms /></React.Suspense>} />
</Route>
<Route path={CREATE_PATH} element={<Create />} />
<Route
@@ -280,7 +287,7 @@ export const createRouter = (clientConfig: ClientConfig, screenSize: ScreenSize)
<PageRoot
nav={
<MobileFriendlyPageNav path={INBOX_PATH}>
<Inbox />
<React.Suspense fallback={null}><Inbox /></React.Suspense>
</MobileFriendlyPageNav>
}
>
@@ -295,8 +302,8 @@ export const createRouter = (clientConfig: ClientConfig, screenSize: ScreenSize)
element={<WelcomePage />}
/>
)}
<Route path={_NOTIFICATIONS_PATH} element={<Notifications />} />
<Route path={_INVITES_PATH} element={<Invites />} />
<Route path={_NOTIFICATIONS_PATH} element={<React.Suspense fallback={null}><Notifications /></React.Suspense>} />
<Route path={_INVITES_PATH} element={<React.Suspense fallback={null}><Invites /></React.Suspense>} />
</Route>
</Route>
<Route path="/*" element={<p>Page not found</p>} />
src/app/plugins/react-custom-html-parser.tsx
+1 -1
View File
@@ -466,7 +466,7 @@ export const getReactCustomHtmlParser = (
onClick={params.handleSpoilerClick}
className={css.Spoiler()}
aria-label="Spoiler — click to reveal"
aria-pressed={false}
aria-pressed={true}
style={{ cursor: 'pointer' }}
>
{domToReact(children, opts)}