Improve User Activity Page Performance #1116
Conversation
* Fixes #1105 * Move logic for displaying actions out of component and into actions/reducers * Create more separated components that are linked to state to check if they should update * Refactor search logic to make it more simpler & faster
src/client/activity/UserActivity.js
Outdated
| @@ -91,7 +74,7 @@ class UserActivity extends React.Component { | |||
| authenticatedUserName: '', | |||
| }; | |||
|
|
|||
| componentDidMount() { | |||
| componentWillMount() { | |||
There was a problem hiding this comment.
componentWillMount is not a place to load async data. componentWillMount triggers on SSR so it wastes resources.
There was a problem hiding this comment.
oh yeah good call will change
| accountHistoryFilter: PropTypes.arrayOf(PropTypes.string), | ||
| userHasMoreActions: PropTypes.bool.isRequired, | ||
| loadingMoreUsersAccountHistory: PropTypes.bool.isRequired, | ||
| isCurrentUser: PropTypes.bool, // eslint-disable-line react/no-unused-prop-types |
There was a problem hiding this comment.
Why is it there if not used?
There was a problem hiding this comment.
used in lines 32 and 42, eslint doesn't recognize it :(
| class UserActivitySearch extends React.Component { | ||
| static propTypes = { | ||
| isCurrentUser: PropTypes.bool, // eslint-disable-line react/no-unused-prop-types |
There was a problem hiding this comment.
Used in line 130 on this file, eslint didn't recognize it :(
There was a problem hiding this comment.
Used in line 32 and 41 above
| @@ -71,7 +71,7 @@ export default class RightSidebar extends React.Component { | |||
| <div> | |||
| {!authenticated && <SignUp />} | |||
| <Switch> | |||
| <Route path="/activity" render={() => <UserActivitySearch />} /> | |||
| <Route path="/activity" render={() => <UserActivitySearch isCurrentUser />} /> | |||
There was a problem hiding this comment.
We can use component instead of render and then we don't need withRouter.
There was a problem hiding this comment.
good call, just updated
|
That look much better, can we have a default margin in the bottom of the content block? Same size than the margin in the bottom of sidebar |
|
@bonustrack yeah just added the same 16px margin-bottom on it. |
|
@bonustrack @Sekhmet quick look whenever you both get a chance again :) |
src/client/activity/UserActivity.js
Outdated
| totalVestingShares: PropTypes.string.isRequired, | ||
| totalVestingFundSteem: PropTypes.string.isRequired, | ||
| user: PropTypes.shape().isRequired, | ||
| currentDisplayedActions: PropTypes.arrayOf(PropTypes.shape()), |
There was a problem hiding this comment.
Not required props are usually below requires ones (currentDisplayedActions and isCurrentUser).
| ) | ||
| class UserActivityActionsList extends Component { | ||
| static propTypes = { | ||
| currentDisplayedActions: PropTypes.arrayOf(PropTypes.shape()), |
There was a problem hiding this comment.
Props should be reordered there as well.
Fixes #1105
Changes: