ece2312ec5
## Issue `normalizeUri` | `parseURI` is expensive and has been causing sluggish operations when called repeatedly or within a loop. ## Change Since I'm not confident enough to remove the call entirely from makeSelectClaimIsMine (although I've yet to find a scenario that the uri is not already normalized), we'll try caching the calls instead. ## Results - in a simple test of toggling between 2 category pages, we saved 20ms from `parseURI` calls alone. - in a test of opening all categories one time, the memory usage remained similar. This makes sense since we removed a `makeSelect*` (which creates a selector for each call + not memoizing), and replaced that with a cached selector that's actually memoizing.
59 lines
2.2 KiB
JavaScript
59 lines
2.2 KiB
JavaScript
import { connect } from 'react-redux';
|
|
|
|
import { withRouter } from 'react-router-dom';
|
|
import CollectionPage from './view';
|
|
import {
|
|
makeSelectTitleForUri,
|
|
makeSelectThumbnailForUri,
|
|
selectClaimIsMineForUri,
|
|
makeSelectClaimIsPending,
|
|
makeSelectClaimForClaimId,
|
|
makeSelectChannelForClaimUri,
|
|
} from 'redux/selectors/claims';
|
|
|
|
import {
|
|
makeSelectCollectionForId,
|
|
makeSelectUrlsForCollectionId,
|
|
makeSelectIsResolvingCollectionForId,
|
|
makeSelectCollectionIsMine,
|
|
makeSelectCountForCollectionId,
|
|
makeSelectEditedCollectionForId,
|
|
} from 'redux/selectors/collections';
|
|
|
|
import { doFetchItemsInCollection, doCollectionDelete, doCollectionEdit } from 'redux/actions/collections';
|
|
import { selectUser } from 'redux/selectors/user';
|
|
|
|
const select = (state, props) => {
|
|
const { match } = props;
|
|
const { params } = match;
|
|
const { collectionId } = params;
|
|
|
|
const claim = collectionId && makeSelectClaimForClaimId(collectionId)(state);
|
|
const uri = (claim && (claim.canonical_url || claim.permanent_url)) || null;
|
|
|
|
return {
|
|
collectionId,
|
|
claim,
|
|
collection: makeSelectCollectionForId(collectionId)(state),
|
|
collectionUrls: makeSelectUrlsForCollectionId(collectionId)(state),
|
|
collectionCount: makeSelectCountForCollectionId(collectionId)(state),
|
|
isResolvingCollection: makeSelectIsResolvingCollectionForId(collectionId)(state),
|
|
title: makeSelectTitleForUri(uri)(state),
|
|
thumbnail: makeSelectThumbnailForUri(uri)(state),
|
|
isMyClaim: selectClaimIsMineForUri(state, uri), // or collection is mine?
|
|
isMyCollection: makeSelectCollectionIsMine(collectionId)(state),
|
|
claimIsPending: makeSelectClaimIsPending(uri)(state),
|
|
collectionHasEdits: Boolean(makeSelectEditedCollectionForId(collectionId)(state)),
|
|
uri,
|
|
user: selectUser(state),
|
|
channel: uri && makeSelectChannelForClaimUri(uri)(state),
|
|
};
|
|
};
|
|
|
|
const perform = (dispatch) => ({
|
|
fetchCollectionItems: (claimId, cb) => dispatch(doFetchItemsInCollection({ collectionId: claimId }, cb)), // if this collection is not resolved, resolve it
|
|
deleteCollection: (id, colKey) => dispatch(doCollectionDelete(id, colKey)),
|
|
editCollection: (id, params) => dispatch(doCollectionEdit(id, params)),
|
|
});
|
|
|
|
export default withRouter(connect(select, perform)(CollectionPage));
|