-
Notifications
You must be signed in to change notification settings - Fork 252
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
componentWillMount is not a place to load async data. componentWillMount triggers on SSR so it wastes resources.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why is it there if not used?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
And there
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Used in line 130 on this file, eslint didn't recognize it :(
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We can use component
instead of render
and then we don't need withRouter
.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
good call, just updated
@bonustrack yeah just added the same 16px margin-bottom on it. |
@bonustrack @Sekhmet quick look whenever you both get a chance again :) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Only thing I've found. Feel free to merge without explicit approval.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Props should be reordered there as well.
Fixes #1105
Changes: