awesome-repositories.com
博客
MCP
awesome-repositories.com

通过 AI 驱动的搜索,发现最优秀的开源仓库。

探索精选搜索开源替代品自托管软件博客网站地图
项目MCP 服务器关于排名机制媒体报道
法律隐私政策服务条款
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·

6 个仓库

Awesome GitHub RepositoriesVariable-Size Content Layout

Engines that handle elements with unpredictable dimensions while maintaining scroll performance.

Distinct from Dynamic Layout Engines: Focuses on the performance and positioning of unpredictable item sizes within a virtualized list.

Explore 6 awesome GitHub repositories matching user interface & experience · Variable-Size Content Layout. Refine with filters or upvote what's useful.

Awesome Variable-Size Content Layout GitHub Repositories

用 AI 发现最棒的仓库。我们将通过 AI 为您搜索最匹配的仓库。
  • bvaughn/react-virtualizedbvaughn 的头像

    bvaughn/react-virtualized

    27,072在 GitHub 上查看↗

    react-virtualized is a library of components for rendering massive lists and tables by drawing only the elements visible in the viewport. It provides specialized layout managers including a windowed grid component and a dynamic height list manager. The project includes a masonry layout engine for packing items of varying heights and widths, as well as an infinite scroll interface for incrementally fetching and appending data. The library covers a broad range of virtualization capabilities, including frozen grid elements, reverse list rendering, and synchronized viewport scrolling. It also su

    Manages elements with unpredictable heights or widths in a list while maintaining precise scroll positions.

    JavaScriptgridlistlistview
    在 GitHub 上查看↗27,072
  • ustbhuangyi/better-scrollustbhuangyi 的头像

    ustbhuangyi/better-scroll

    16,489在 GitHub 上查看↗

    Better-scroll is a JavaScript scroll library and touch interaction engine designed to create high-performance scrollable areas in web browsers. It functions as a modular UI component framework that provides the foundation for building complex scrollable elements. The library is distinguished by a plugin-based architecture that allows the injection of custom methods and event hooks. This system enables the creation of specialized interface components such as carousel sliders, scrollable picker inputs, and draggable element systems. The project covers a wide range of mobile web interaction pat

    Monitors element size changes and image loads to automatically update the total scrollable area height.

    TypeScriptbetter-performanceiosiscroll
    在 GitHub 上查看↗16,489
  • shipshapecode/tethershipshapecode 的头像

    shipshapecode/tether

    8,489在 GitHub 上查看↗

    Tether is a DOM positioning engine designed to anchor floating user interface elements, such as tooltips and dropdowns, to target elements. It functions as a logic engine for managing the placement of overlays and synchronizing the position of secondary elements relative to primary anchors. The system includes collision detection and overflow prevention to ensure that floating menus and overlays remain within the visible viewport. It automatically repositions elements when they encounter page boundaries to prevent visual clipping. The tool manages dynamic element alignment and tracking durin

    Maintains element alignment and spacing dynamically based on container state and window resizing.

    JavaScripthacktoberfestjavascriptposition
    在 GitHub 上查看↗8,489
  • davidcetinkaya/embla-carouseldavidcetinkaya 的头像

    davidcetinkaya/embla-carousel

    8,301在 GitHub 上查看↗

    Embla Carousel is a framework-agnostic JavaScript library used to build sliding content galleries and touch-enabled slider components. It provides a toolkit for creating carousels that function independently of any specific frontend framework or DOM library. The library focuses on precision swiping and fluid motion for interactive image galleries and custom content sliders. It is designed to maintain consistent behavior across different browser environments and device screen sizes.

    Calculates slide dimensions and gaps dynamically to maintain perfect alignment across different screen sizes.

    TypeScript
    在 GitHub 上查看↗8,301
  • gss/enginegss 的头像

    gss/engine

    2,856在 GitHub 上查看↗

    This project is a CSS layout framework that functions as a responsive UI geometry solver. It replaces traditional static box model calculations with a constraint-based engine that determines element positions and dimensions by evaluating relational rules. The engine distinguishes itself by using a system of linear equations to resolve geometric conflicts, ensuring that all spatial constraints are satisfied simultaneously. It utilizes a shorthand visual syntax to define these relationships, allowing developers to describe complex alignment and spacing requirements through a declarative languag

    Positions elements relative to specific coordinates or other element properties to maintain precise spatial alignment across dynamic viewports.

    CoffeeScript
    在 GitHub 上查看↗2,856
  • clauderic/react-tiny-virtual-listclauderic 的头像

    clauderic/react-tiny-virtual-list

    2,488在 GitHub 上查看↗

    React tiny virtual list is a zero-dependency component library that optimizes performance for extensive vertical and horizontal collections by rendering only the items currently visible in the viewport. It handles large datasets efficiently while supporting variable item dimensions and dynamic content updates at runtime. The component supports both horizontal and vertical scroll directions, absolute positioning layouts, and dynamic offset measurements computed via fixed numbers, size arrays, or callback functions. It also provides imperative methods to programmatically scroll or jump to speci

    Supports both vertical and horizontal scroll directions with fixed or variable item sizes and dynamic measurements.

    TypeScriptreactreact-componentvirtual-scroll
    在 GitHub 上查看↗2,488
  1. Home
  2. User Interface & Experience
  3. Dynamic Layout Engines
  4. Variable-Size Content Layout

探索子标签

  • DOM Mutation ObserversUtilities that monitor DOM changes to dynamically update scrollable dimensions. **Distinct from Variable-Size Content Layout:** Focuses on observing DOM mutations to update total scroll area, whereas Variable-Size Content Layout focuses on the positioning of items within the list.
  • Dynamic Alignment EnginesEngines that maintain element alignment and spacing dynamically based on container state and scale. **Distinct from Variable-Size Content Layout:** Focuses on maintaining alignment and gaps across window resizing, whereas Variable-Size Content Layout focuses on performance for unpredictable item sizes.