Moment For Technology

Revision of novel reader Flutter - changes to pagination

Posted on Nov. 27, 2023, 8:36 p.m. by Martyn Williams
Category: android Tag: flutter


Another important aspect of the novel reader is this paging logic; In the previous project, the pagination part was more complicated: in addition to calculating the pagination part, we had to draw and generate the picture to cache;

Now use the ListView to process, but save a cache picture part, so bring some changes;

Analysis of the

The first part is the calculation part. After a look, it is still the way of Textpainter before, but it seems that the performance is really improved a lot. Strictly speaking, not a lot, but very huge...

Take this passage:

According to the following code comment, 8000 word page length is 12ms? (I don't know if this was a bad one, or if there was a huge performance optimization on the underlying Flutter, or if the demo I wrote was buggy...)

If according to this ratio, 1W words more than ten ms, mobile phone screen can display text is only a few hundred words, at most thousands; If you only calculate the content of the current page, it will take less than 1ms?

This is like putting the main isolate directly and then calculating the widget every time itemBuilder needs to build it, and only counting the contents of one page

In combination with the previous part of the ListView that determines whether the image needs to be displayed according to the speed, the change will not affect the fast sliding part; It seems feasible;

But let's take a look at the changes in this section and briefly summarize the pagination changes:

The overall logic of paging hasn't changed much, but now that we're using ListView, we don't need to draw and cache the entire program, we just need to know the contents of individual pages.

The Rest is handled by the itemBuilder building corresponding widgets based on the content; Here's an example:

Assemble the content as TextSpan and set it to text. rich like this:

Here, I have reduced the content portion of the computed pages by 300 height and added a Container of 300 height to the itemBuilder; And provided it as WidgetSpan;

The effect is also very smooth, and there is no big problem

At the end

Now that I've evaluated it, it looks like the pagination area is not going to have much of a performance impact right now, and it can even be evaluated at any time without affecting the UI;

I then tried to modify this to count only one page at a time to see if there was no performance pressure at all as assessed

About (Moment For Technology) is a global community with thousands techies from across the global hang out!Passionate technologists, be it gadget freaks, tech enthusiasts, coders, technopreneurs, or CIOs, you would find them all here.