Viewerframe Mode Refresh Top -

return ( <div className="viewerframe" ref=frameRef mode=mode> /* Content */ <button onClick=refreshAndGoTop>Refresh Top</button> </div> );

<viewer-frame mode="refresh-top" auto-refresh-interval="30"> <!-- content --> </viewer-frame> The phrase "viewerframe mode refresh top" is more than a search keyword—it is a specification for predictable, user-respecting UI behavior. By explicitly setting a mode where refreshes reset the viewport to the top, you trade a tiny amount of user scroll effort for massive gains in data consistency and interface clarity. viewerframe mode refresh top

setMode('view'); , 0); ;

const virtualizer = useVirtualizer( count: items.length, getScrollElement: () => frameRef.current, estimateSize: () => 50, ); const refreshTop = () => // Clear the cache setItems(newItems); // Scroll to the very first row virtualizer.scrollToIndex(0, align: 'start' ); ; Modern CSS introduces scroll-anchoring . Browsers try to keep the user's view stable. However, to enforce mode refresh top , you override this: Browsers try to keep the user's view stable

/* Ensure fresh renders start at top */ .viewerframe:mode-refresh scroll-behavior: auto; scroll-snap-type: none; to enforce mode refresh top

.item padding: 20px; border-bottom: 1px solid #eee;

.viewerframe overflow-y: auto; scroll-anchoring: none; /* Disable browser's default anchoring */