* Summary: fix slowness due to layout thrashing when reloading a large set of status updates
in order to limit the maximum size of a status in a list view (e.g. the home timeline), so as to avoid having to scroll all the way through an abnormally large status update (see https://github.com/tootsuite/mastodon/pull/8205), the following steps are taken:
•the element containing the status is rendered in the browser
•its height is calculated, to determine if it exceeds the maximum height threshold.
Unfortunately for performance, these steps are carried out in the componentDidMount(/Update) method, which also performs style modifications on the element. The combination of height request and style modification during javascript evaluation in the browser leads to layout-thrashing, where the elements are repeatedly re-laid-out (see https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing & https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Performance_best_practices_for_Firefox_fe_engineers).
The solution implemented here is to memoize the collapsed state in Redux the first time the status is seen (e.g. when fetched as part of a small batch, to populate the home timeline) , so that on subsequent re-renders, the value can be queried, rather than recalculated. This strategy is derived from https://github.com/tootsuite/mastodon/pull/4439 & https://github.com/tootsuite/mastodon/pull/4909, and should resolve https://github.com/tootsuite/mastodon/issues/12455.
Andrew Lin (https://github.com/onethreeseven) is thanked for his assistance in root cause analysis and solution brainstorming
* remove getSnapshotBeforeUpdate from status
* remove componentWillUnmount from status
* persist last-intersected status update and restore when ScrollableList is restored
e.g. when navigating from home-timeline to a status conversational thread and <Back again
* cache currently-viewing status id to avoid calling redux with identical value
* refactor collapse toggle to pass explicit boolean
* Add keyword filtering
GET|POST /api/v1/filters
GET|PUT|DELETE /api/v1/filters/:id
- Irreversible filters can drop toots from home or notifications
- Other filters can hide toots through the client app
- Filters use a phrase valid in particular contexts, expiration
* Make sure expired filters don't get applied client-side
* Add missing API methods
* Remove "regex filter" from column settings
* Add tests
* Add test for FeedManager
* Add CustomFilter test
* Add UI for managing filters
* Add streaming API event to allow syncing filters
* Fix tests
onScrollToBottom was a function to run instead of onScrollToTop and
onScroll when scrolling to the bottom. The behavior to prevent
onScrollToTop was inconvenient because the viewport can be at the bottom
and at the top at the same time if the viewport is larger than the
container.
onScrollToBottom was also called when the button to load more is clicked
on contray to the name suggests, which led notifications and
status_list_container components to mark the scrolled location is not at
the top mistakenly.
onLoadMore is a replacement for onScrollToBottom. It will be called
independently from onScrollToTop and onScroll.
* Fix regeneration marker not being removed after completion
* Return HTTP 206 from /api/v1/timelines/home if regeneration in progress
Prioritize RegenerationWorker by putting it into default queue
* Display loading indicator and poll home timeline while it regenerates
* Add graphic to regeneration message
* Make "not found" indicator consistent with home regeneration
* Add aria-autocomplete='list' in Textaria
ref: https://www.w3.org/TR/wai-aria-1.1/#aria-autocomplete
* Make detect empty string brefore assign upload description
* Change code elements in keyboard-shortcuts component to kbd
* Add validation for onMuteNotifications
* Make columns-area unscrollable when modal opend
* Make columns-area unscrollable when modal opened
Commit 9d1f8b9d6a scrolls the columns area
when the route changes since the user is likely to want to see the
rightmost column in such cases.
However, redirection is automatic and does not indicate users' intension.
Do not scroll the columns area due to one.
* Move ancestors/descendants out of timelines reducer
* Refactor timelines reducer
All types of timelines now have a flat structure and use the same
reducer functions and actions
* Reintroduce some missing behaviours
* Fix wrong import in reports
* Fix includes typo
* Fix issue related to "next" pagination in timelines and notifications
* Fix bug with timeline's initial state, expandNotifications
* Allow mounting arbitrary columns
* Refactor column headers, allow pinning/unpinning and moving columns around
* Collapse animation
* Re-introduce scroll to top
* Save column settings properly, do not display pin options in
single-column view, do not display collapse icon if there is
nothing to collapse
* Fix one instance of public timeline being closed closing the stream
Fix back buttons inconsistently sending you back to / even if history exists
* Getting started displays links to columns that are not mounted
* ui: check spoiler_text against regex filter (#1635)
When filtering by regex, also check the spoiler_text if
present.
* ui: concatenate spoiler and content in reducer
Simplifies aa5b03c, clarifies intent of the field
* Replace browserify with webpack
* Add react-intl-translations-manager
* Do not minify in development, add offline-plugin for ServiceWorker background cache updates
* Adjust tests and dependencies
* Fix production deployments
* Fix tests
* More optimizations
* Improve travis cache for npm stuff
* Re-run travis
* Add back support for custom.scss as before
* Remove offline-plugin and babili
* Fix issue with Immutable.List().unshift(...values) not working as expected
* Make travis load schema instead of running all migrations in sequence
* Fix missing React import in WarningContainer. Optimize rendering performance by using ImmutablePureComponent instead of
React.PureComponent. ImmutablePureComponent uses Immutable.is() to compare props. Replace dynamic callback bindings in
<UI />
* Add react definitions to places that use JSX
* Add Procfile.dev for running rails, webpack and streaming API at the same time
Matt Panaro