I’ve been working hard on building a virtual scrolling system using a ScrollingFrame in Roblox that relies entirely on Scale (not Offset) for UI sizing and positioning. My goal is to create a system that can handle an infinite number of items efficiently (or at least a very large amount), using a UIGridLayout, without causing FPS drops or performance issues during scrolling.
Over the past month, I’ve tried multiple approaches—spending hours, days, and even weeks on this—but I haven’t yet been able to achieve a smooth and scalable result. The biggest challenges I’m facing include:
Maintaining good performance while scrolling with many elements
Using Scale-based sizing (important for responsiveness across screen sizes)
Making it truly dynamic and virtual (only rendering what’s visible)
If anyone has experience with this, has built something similar, or can point me toward an example, resource, or module that does this effectively, I’d be incredibly grateful.
Thanks so much in advance for any help, tips, or insights you can share!
I haven’t done anything in regards to huge scrolling frames, but I think it’s important to note that you aren’t necessarily limited to scale only. You can use a few tricks to keep offset the same on mostly all screens as well.
Using a UIScale inside of a ScreenGui and some code alleviates this issue. Run this function once, and also everytime the viewport size of the camera changes.
local UIScale = UI:WaitForChild("UIScale")
local Resolution = (1 / 1080)
local SizeX, SizeY = self.Camera.ViewportSize.X, self.Camera.ViewportSize.Y
local Scale = (Resolution * math.min(SizeX, SizeY))
UIScale.Scale = Scale
The resolution should match the screen you designed the offset UI on. I find it helpful to use the device emulator to keep the resolution exact while creating offset based UI.
