Virtual Scrolling

Rare Earth Juejin Tech Community

Aug 22, 2024 · Frontend Development

Understanding Virtual Scrolling in Frontend Development: Principles, Use Cases, and Implementation

This article explains the concept of virtual scrolling, why it is needed for performance in web pages, outlines two main implementation strategies, and provides detailed Vue‑based code examples—including Element‑Plus Infinite Scroll and a custom VirtualList class—to help developers apply the technique effectively.

Element-PlusInfinite ScrollPerformance Optimization

0 likes · 24 min read

Understanding Virtual Scrolling in Frontend Development: Principles, Use Cases, and Implementation

Rare Earth Juejin Tech Community

May 30, 2024 · Frontend Development

Virtual Scrolling Techniques and Performance Optimization for Large Document Editors

This article explains how virtual scrolling can dramatically improve the performance of large online document editors by rendering only visible content, discusses various implementation strategies such as progressive pagination, canvas rendering, line‑ and block‑level virtualization, and details state management, view‑locking, fast‑scroll handling, and integration scenarios like anchor navigation, find‑replace, and comment systems, while providing code examples and performance test results.

Performance OptimizationReactVirtual Scrolling

0 likes · 57 min read

Virtual Scrolling Techniques and Performance Optimization for Large Document Editors

Rare Earth Juejin Tech Community

Jan 14, 2024 · Frontend Development

High‑Performance GridList Component with Pagination and Virtual Scrolling in Vue 3

This article introduces a Vue 3 GridList component that supports responsive grid layouts, server‑side pagination via a request function, and virtual scrolling to render only visible items, providing performance improvements for large data sets while offering clear usage examples and full source code.

GridListPerformanceVirtual Scrolling

0 likes · 17 min read

High‑Performance GridList Component with Pagination and Virtual Scrolling in Vue 3

Beijing SF i-TECH City Technology Team

Sep 27, 2023 · Backend Development

Performance Analysis and Optimization Report for a Logistics Platform

This report analyzes performance issues in a logistics platform, identifying backend IC card interface timeouts causing database connection pool exhaustion and frontend problems from excessive DOM elements and network loading, then proposes optimizations including interface migration, CDN, compression, preloading, domain sharding, and virtual scrolling.

IC card interfaceVirtual Scrollingbackend optimization

0 likes · 9 min read

Performance Analysis and Optimization Report for a Logistics Platform

DeWu Technology

Mar 27, 2023 · Frontend Development

Optimizing Pull‑Down Loading and Scroll Experience in IM Chat Message Lists

The article explains how to optimize pull‑down loading for instant‑messaging conversation lists using virtual scrolling, detailing a three‑step loading flow, evaluating timeout, onload, and reverse‑rendering strategies, and recommending column‑reverse rendering to achieve smooth, accurate scroll rollback and better user experience.

PerformanceVirtual Scrollingchat UI

0 likes · 11 min read

Optimizing Pull‑Down Loading and Scroll Experience in IM Chat Message Lists

ByteFE

Apr 20, 2021 · Frontend Development

Implementing a Virtual Scrolling List in Ant Design Modal for Performance Optimization

This article explains how to replace a sluggish, long list inside an Ant Design Modal with a custom virtual scrolling component, covering fixed‑height and variable‑height implementations, buffer optimization, binary search for index lookup, and includes full React code examples.

PerformanceReactVirtual Scrolling

0 likes · 14 min read

Implementing a Virtual Scrolling List in Ant Design Modal for Performance Optimization