Skip to content

Feat/virtual scroll infinite load#5

Merged
Rinisnotarobot merged 4 commits into
masterfrom
feat/virtual-scroll-infinite-load
May 26, 2026
Merged

Feat/virtual scroll infinite load#5
Rinisnotarobot merged 4 commits into
masterfrom
feat/virtual-scroll-infinite-load

Conversation

@Rinisnotarobot

Copy link
Copy Markdown
Owner

This pull request implements infinite scrolling for the public articles list using virtual rendering, improving both performance and user experience. It introduces a new cursor-based pagination API, updates the frontend to use a virtualized list, and cleans up the codebase by removing the old paginated articles page. Supporting changes include dependency updates and improved documentation.

Infinite Scroll & Virtualization for Articles

  • Implemented infinite scrolling with virtualization:
    • Added VirtualArticleList component using @tanstack/react-virtual to efficiently render large lists of articles with infinite loading support.
    • Updated the articles route (src/routes/_app/articles.tsx) to use the new virtualized list component instead of the old paginated approach.
    • Removed the old ArticlesPage implementation. [1] [2]

Backend & Query Layer Updates

  • Added cursor-based pagination API:
    • Introduced getPublishedArticlesInfiniteFn server function for cursor-based pagination. [1] [2]
    • Added corresponding Zod schema getPublishedArticlesInfiniteSchema and types. [1] [2]
  • Added React Query hook usePublishedArticlesInfinite for infinite loading of articles. [1] [2]
  • Updated query keys to support infinite lists.

Dependency & Build Improvements

  • Added @tanstack/react-virtual and related packages to dependencies and lockfile. [1] [2] [3] [4] [5] [6]
  • Added a production start script and improved Docker support:
    • Added start script to package.json.
    • Added .dockerignore and a multi-stage Dockerfile for optimized builds. [1] [2]

Documentation Updates

  • Updated README.md to reflect new directory structure, data layer, and route changes. [1] [2]

These changes modernize the articles list with infinite scrolling and virtualization, streamline the codebase, and improve build and deployment workflows.

rinisnotarobot and others added 4 commits May 26, 2026 13:20
使用 @tanstack/react-virtual 实现文章列表的虚拟滚动,
支持基于 cursor 的无限加载,优化大数据量下的渲染性能。

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
About 页面包含项目介绍、技术栈展示和功能特性说明,
同步更新 README.md 以反映最新的项目结构。

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
添加 Dockerfile 和 .dockerignore 用于容器化部署,
package.json 新增 start 脚本支持生产环境运行。

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Copilot AI review requested due to automatic review settings May 26, 2026 05:30
@Rinisnotarobot Rinisnotarobot merged commit c182454 into master May 26, 2026
@Rinisnotarobot Rinisnotarobot review requested due to automatic review settings May 26, 2026 05:54
@Rinisnotarobot Rinisnotarobot deleted the feat/virtual-scroll-infinite-load branch May 28, 2026 05:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant