Commit Graph

30 Commits

Author SHA1 Message Date
Nathan Sobo
7dfe829fc8 Style lines with inline styles for performance 2014-05-16 15:31:15 -06:00
Nathan Sobo
c87bc57f9e Don't update top positions of lines/lineNodes unless they have changed 2014-05-16 15:31:15 -06:00
Nathan Sobo
d15fd34f7a Render selections on lines layer; don't put each line number on GPU 2014-05-16 15:31:14 -06:00
Nathan Sobo
a118cdd32b Put selections and lines on the GPU together in sibling divs 2014-05-16 15:31:14 -06:00
Nathan Sobo
3a2de9c698 Don't render every line on the GPU
Opaque lines are turning out to be a total pain, plus they ruin absolute
positioning on the lines div. The slight speed boost isn't seeming worth
it anymore.
2014-05-16 15:31:14 -06:00
Nathan Sobo
c60e5d90fd 💄 2014-05-16 15:31:14 -06:00
Nathan Sobo
695f8da3c3 💄 extract buildLineInnerHTML method 2014-05-16 15:31:14 -06:00
Nathan Sobo
ea5c5c9e84 Move line HTML generation into lines component 2014-05-16 15:31:14 -06:00
Nathan Sobo
4f9108980f WIP: Manually update line nodes when scrolling 2014-05-16 15:31:14 -06:00
Nathan Sobo
0162247bd7 Precompute selection regions for all lines
This is easer to reason about and probably more efficient than computing
everything on a per-line basis.
2014-05-16 15:31:13 -06:00
Nathan Sobo
cbcc30b384 Don't render empty selections 2014-05-16 15:31:13 -06:00
Nathan Sobo
7a9278e6a7 Render selection fragments on opaque lines
Because lines are opaque on the GPU for sub pixel antialiasing, the
lines obscure the selections which were formerly rendered behind the
lines. This commit renders selection fragments *on* each opaque line
layer so the selections look correct again. Still needs cleanup and
optimization.
2014-05-16 15:31:13 -06:00
Nathan Sobo
01622140e3 Rename renderedRowRange to visibleRowRange
We only render visible rows now, so this makes more sense.
2014-05-16 15:31:13 -06:00
Nathan Sobo
63488997ee Give lines and line numbers an opaque background to support sub-pixel AA
Since lines and line numbers are now on the GPU, their text won't be
properly anti-aliased on low-resolution displays unless their layers
have a solid background.
2014-05-16 15:31:12 -06:00
Nathan Sobo
cfc08e8b98 Allow horizontal scrolling 2014-05-16 15:31:12 -06:00
Nathan Sobo
7d8256d343 Drop lineOverdraw and scroll-view-content div 2014-05-16 15:31:11 -06:00
Nathan Sobo
bf9f8597a7 Give each line its own layer on the GPU 2014-05-16 15:31:11 -06:00
Nathan Sobo
9f2c8c1756 Measure characters in new lines when vertically scrolling stops 2014-05-16 15:31:11 -06:00
Nathan Sobo
1f768a21f0 Update absolute position of lines and line numbers when text changes
When lines are inserted or removed, we need to manually shift the
on-screen lines since everything is absolutely positioned now.
2014-04-22 17:10:22 -06:00
Nathan Sobo
22496ceeb1 WIP: Minimize paint when scrolling and composite lines with the GPU 2014-04-22 17:10:22 -06:00
Nathan Sobo
a03f2f46ee Don't assume tokens match text nodes when measuring character widths 2014-04-22 17:10:22 -06:00
Nathan Sobo
fdccc0bcc2 Measure DOM dimensions before rendering elements that depend on them
This commit breaks the initial render of the editor component into two
stages.

The first stage just renders the shell of the editor so the height,
width, line height, and default character width can be measured. Nothing
that depends on these values is rendered on the first render pass.

Once the editor component is mounted, all these values are measured and
we force another update, which fills in the lines, line numbers,
selections, etc.

We also refrain from assigning an explicit height and width on the
model if these values aren't explicitly styled in the DOM, and just
assume the editor will stretch to accommodate its contents.
2014-04-22 17:10:21 -06:00
Nathan Sobo
201e00aa83 Don't measure new lines when scrolling with the mousewheel
It impacts scrolling performance. We can measure when scrolling comes
to a halt.
2014-04-22 17:09:44 -06:00
Nathan Sobo
f02d956362 Preserve the only the target screen row when scrolling via mousewheel
When the target of a mousewheel event is removed, it breaks velocity
scrolling.

Previously, we were preserving the entire screen range when scrolling
with the mouse wheel, which caused a lot of DOM nodes to accumulate. Now
we only preserve the individual line and line number associated with the
target of the mousewheel event, moving them just off screen below all
the on-screen lines and line numbers. This keeps the number of DOM nodes
limited while retaining velocity effects.
2014-04-22 17:09:44 -06:00
Nathan Sobo
216d561c79 Delay creating range and node iterator until we actually need to measure 2014-04-22 17:09:44 -06:00
Nathan Sobo
6607f99c6c Use padding-top/bottom rather than spacer divs in lines and gutter
It creates a simpler DOM structure.
2014-04-22 17:09:44 -06:00
Nathan Sobo
5a9a3c62e1 Implement shouldComponentUpdate for LinesComponent
We accumulate pending changes and pass them to the lines and the gutter
to help them determine whether to update. The lines only update if the
visible row range changed or if there was a change in the visible row
range.
2014-04-22 17:09:44 -06:00
Nathan Sobo
b96abfffb7 Add more displayNames 2014-04-22 17:09:44 -06:00
Nathan Sobo
550a4ce906 Use isEqualForProperties in LinesComponent to decide when to re-measure 2014-04-22 17:09:43 -06:00
Nathan Sobo
e952ab2e02 Extract a LinesComponent 2014-04-22 17:09:42 -06:00