search

Osmose / advanced-open-file

Open files and folders in Atom easily.
https://atom.io/packages/advanced-open-file
Other
118 stars 20 forks source link

Should not do any synchronous IO #56

Open artagnon opened 9 years ago

artagnon commented 9 years ago

Especially after typing ~/, it hangs for a bit for me. It would be nice if we could do the IO of listing the entries in a directory incrementally.

Osmose commented 9 years ago

+1, will keep in mind during refactoring

Osmose commented 8 years ago

So I've spent a few weekends working on this, and I've got something close, but not quite there: https://github.com/Osmose/advanced-open-file/compare/react

Here's what happened:

  1. I wanted to make all the file operations async. But the current view code had grown to be difficult to follow and made making this change difficult.
  2. I rewrote the view code in React to see if it was easier to manage. My attempt was more complex than I'd like, but it was enough! There wasn't any real major performance improvement, which was expected.
  3. I moved all the file operation methods out of the Path model class an into a single fileService object. This was to implement caching of file operations in one spot. It didn't really help our speed on large directories. I realized that the massive amount of DOM elements being inserted was a likely culprit.
  4. I found a lovely React library called react-infinite that would only render visible elements in the list. It made a huge difference in the rendering time of directories with a lot of elements. However, loading the directory still took a second or two, and froze the UI.
  5. I made all the file operations async. It was a lot of playing the What Color is Your Function? game. This avoided locking up the UI for the first large directory read, but subsequent reads were still slow. I suspected the caching was to blame, but I tested by rendering the large list of files and then filtering on a common prefix, to avoid the caching. It still locked up.

I suspected that the React DOM diffing was taking a long time, but my recent profiling attempts show some weird call graphs:

screen shot 2016-04-16 at 5 19 22 pm

That's after typing another letter in a common prefix of a directory with 10,000 files. Those three flat peaks are topped with removeChild calls that take between 50ms and 100ms deep within React's DOM-change code. But those huge gaps are trouble too.

So I'm still investigating. But help is always appreciated!