I’m currently doing a spike on setting up custom scrolling logic in Elm.
The idea is that if you have a large file to display, perhaps a log or a large file in an editor, rendering the full
view for it each time, can be slow. The default way of using
overflow: scroll on the
div works, but is not optimal. Instead scroll bars are set up in separate
divs to the one showing the content, their scroll events are hooked up, and custom logic will take a slice of the content and render a smaller view just for what is visible.
Has anyone done this before?
Demo and Code
The current WIP is here:
Going to be looking at:
- Calculating the size of the div to scroll, so scroll bars can be appropriately sized.
- Implementing the slice, and positioning the lines to be displayed.
- Mouse wheel, page up, page down, ctrl+home, ctrl+end and so on.
- Listening for resize events and re-doing the size calcs.
- Optimization so the scrolling is as smooth as I can get it, and update/view cycle is quick enough to support an editor on large files.