Skip to content

Commit 4e3ce54

Browse files
cammelloscammellos
committed
Reduce renderings in community overview
status-im/status-go@c15f9e7...1ea2bd9 This PR reduces the amount of rendering in community overview. It limits the amount of data is passed to components to the necessary, and it creates functions on component initialization so that they won't cause a re-render. Performance of the header are very noticeably better on my local environment, though on nightly builds is less noticeable. It also removes data from `communities/communities id` as that cause a re-render of any component subscribed to it.
1 parent 37be08d commit 4e3ce54

File tree

6 files changed

+100
-85
lines changed

6 files changed

+100
-85
lines changed

Diff for: ‎src/status_im/contexts/communities/overview/events.cljs

+8-10
Original file line numberDiff line numberDiff line change
@@ -10,16 +10,16 @@
1010
{:db (-> db
1111
(assoc-in [:community-channels-permissions community-id]
1212
(data-store/rpc->channel-permissions (:channels response)))
13-
(assoc-in [:communities community-id :checking-all-channels-permissions?] false))}))
13+
(assoc-in [:communities/channel-permissions-check community-id] false))}))
1414

1515
(rf/reg-event-fx :communities/check-all-community-channels-permissions-failed
1616
(fn [{:keys [db]} [community-id]]
17-
{:db (assoc-in db [:communities community-id :checking-all-channels-permissions?] false)}))
17+
{:db (assoc-in db [:communities/channel-permissions-check community-id] false)}))
1818

1919
(rf/reg-event-fx :communities/check-all-community-channels-permissions
2020
(fn [{:keys [db]} [community-id]]
2121
(when (get-in db [:communities community-id])
22-
{:db (assoc-in db [:communities community-id :checking-all-channels-permissions?] true)
22+
{:db (assoc-in db [:communities/channel-permissions-check community-id] true)
2323
:fx [[:json-rpc/call
2424
[{:method "wakuext_checkAllCommunityChannelsPermissions"
2525
:params [{:CommunityID community-id}]
@@ -38,21 +38,19 @@
3838
(let [token-permissions-check (cond-> result
3939
based-on-client-selection? (assoc :based-on-client-selection? true))]
4040
{:db (-> db
41-
(assoc-in [:communities community-id :checking-permissions?] false)
42-
(assoc-in [:communities community-id :token-permissions-check]
43-
token-permissions-check))})))
41+
(assoc-in [:communities/permissions-check community-id]
42+
{:checking? false
43+
:check token-permissions-check}))})))
4444

4545
(rf/reg-event-fx :communities/check-permissions-to-join-community-failed
4646
(fn [{:keys [db]} [community-id]]
47-
{:db (assoc-in db [:communities community-id :checking-permissions?] false)}))
47+
{:db (assoc-in db [:communities/permissions-check community-id :checking?] false)}))
4848

4949
(rf/reg-event-fx :communities/check-permissions-to-join-community
5050
(fn [{:keys [db]} [community-id addresses based-on-client-selection?]]
5151
(when-let [community (get-in db [:communities community-id])]
5252
(when-not (:checking-permissions? community)
53-
{:db (-> db
54-
(assoc-in [:communities community-id :checking-permissions?] true)
55-
(assoc-in [:communities community-id :can-request-access?] false))
53+
{:db (assoc-in db [:communities/permissions-check community-id :checking?] true)
5654
:json-rpc/call [{:method "wakuext_checkPermissionsToJoinCommunity"
5755
:params [(cond-> {:communityId community-id}
5856
addresses

Diff for: ‎src/status_im/contexts/communities/overview/view.cljs

+25-21
Original file line numberDiff line numberDiff line change
@@ -112,7 +112,7 @@
112112

113113
(defn- network-not-supported
114114
[]
115-
[quo/text (i18n/label :network-not-supported)])
115+
[quo/text (i18n/label :t/network-not-supported)])
116116

117117
(defn- request-access-button
118118
[id color]
@@ -253,15 +253,17 @@
253253
:description-accessibility-label :community-description}])
254254

255255
(defn- community-content
256-
[{:keys [id]}]
256+
[id]
257257
(rf/dispatch [:communities/check-all-community-channels-permissions id])
258-
(fn [{:keys [name description joined spectated images tags color id membership-permissions?]
259-
:as community}
258+
(fn [id
260259
{:keys [on-category-layout
261260
collapsed?
262261
on-first-channel-height-changed]}]
263-
(let [joined-or-spectated (or joined spectated)
264-
chats-by-category (rf/sub [:communities/categorized-channels id])]
262+
(let [{:keys [name description joined spectated images tags color id membership-permissions?]
263+
:as community}
264+
(rf/sub [:communities/community id])
265+
joined-or-spectated (or joined spectated)
266+
chats-by-category (rf/sub [:communities/categorized-channels id])]
265267
[:<>
266268
[rn/view {:style style/community-content-container}
267269
(when-not collapsed?
@@ -311,20 +313,24 @@
311313
(and (>= scroll-height (+ height first-channel-height))
312314
category)))))
313315

314-
(defn- community-scroll-page
315-
[{:keys [joined]}]
316-
(let [scroll-height (reagent/atom 0)
317-
categories-heights (reagent/atom {})
318-
first-channel-height (reagent/atom 0)
319316
;; We track the initial value of joined
320317
;; as we open the page to avoid switching
321318
;; from not collapsed to collapsed if the
322319
;; user is on this page
323-
initial-joined? joined]
324-
(fn [{:keys [id name images] :as community}]
320+
321+
(defn- community-scroll-page
322+
[_ initial-joined? _ _]
323+
(let [scroll-height (reagent/atom 0)
324+
categories-heights (reagent/atom {})
325+
first-channel-height (reagent/atom 0)
326+
on-category-layout (partial add-category-height categories-heights)
327+
on-first-channel-height-changed (fn [height categories]
328+
(swap! categories-heights select-keys categories)
329+
(reset! first-channel-height height))]
330+
(fn [id joined name images]
325331
(let [cover {:uri (get-in images [:banner :uri])}
326332
logo {:uri (get-in images [:thumbnail :uri])}
327-
collapsed? (and initial-joined? (:joined community))
333+
collapsed? (and initial-joined? joined)
328334
overlay-shown? (boolean (:sheets (rf/sub [:bottom-sheet])))]
329335
[scroll-page/scroll-page
330336
{:cover-image cover
@@ -347,24 +353,22 @@
347353
@first-channel-height
348354
@categories-heights)}]}
349355
[community-content
350-
community
351-
{:on-category-layout (partial add-category-height categories-heights)
356+
id
357+
{:on-category-layout on-category-layout
352358
:collapsed? collapsed?
353359
:on-first-channel-height-changed
354360
;; Here we set the height of the component and we filter out the categories, as some
355361
;; might have been removed.
356-
(fn [height categories]
357-
(swap! categories-heights select-keys categories)
358-
(reset! first-channel-height height))}]]))))
362+
on-first-channel-height-changed}]]))))
359363

360364
(defn- community-card-page-view
361365
[id]
362-
(let [{:keys [id joined]
366+
(let [{:keys [id joined name images]
363367
:as community} (rf/sub [:communities/community id])]
364368
(when community
365369
(when joined
366370
(rf/dispatch [:activity-center.notifications/dismiss-community-overview id]))
367-
[community-scroll-page community])))
371+
[community-scroll-page id joined name images])))
368372

369373
(defn view
370374
[id]

Diff for: ‎src/status_im/subs/communities.cljs

+15-7
Original file line numberDiff line numberDiff line change
@@ -311,25 +311,33 @@
311311
:amount (wallet.utils/remove-trailing-zeroes amount)
312312
:img-src (get token-images sym)}))
313313

314+
(re-frame/reg-sub
315+
:communities/checking-permissions-by-id
316+
:<- [:communities/permissions-check]
317+
(fn [permissions [_ id]]
318+
(get permissions id)))
319+
314320
(re-frame/reg-sub
315321
:community/token-gated-overview
316322
(fn [[_ community-id]]
317-
[(re-frame/subscribe [:communities/community community-id])])
318-
(fn [[{:keys [token-permissions-check checking-permissions? token-images]}] _]
319-
(let [highest-role (:highestRole token-permissions-check)
320-
networks-not-supported? (:networksNotSupported token-permissions-check)
321-
lowest-role (last (:roles token-permissions-check))
323+
[(re-frame/subscribe [:communities/community community-id])
324+
(re-frame/subscribe [:communities/checking-permissions-by-id community-id])])
325+
(fn [[{:keys [token-images]}
326+
{:keys [checking? check]}] _]
327+
(let [highest-role (:highestRole check)
328+
networks-not-supported? (:networksNotSupported check)
329+
lowest-role (last (:roles check))
322330
highest-permission-role (:type highest-role)
323331
can-request-access? (and (boolean highest-permission-role) (not networks-not-supported?))]
324332
{:can-request-access? can-request-access?
325333
:highest-permission-role highest-permission-role
326334
:networks-not-supported? networks-not-supported?
327335
:no-member-permission? (and highest-permission-role
328-
(not (-> token-permissions-check :highestRole :criteria)))
336+
(not (-> check :highestRole :criteria)))
329337
:tokens (map (fn [{:keys [tokenRequirement]}]
330338
(map
331339
(partial token-requirement->token
332-
checking-permissions?
340+
checking?
333341
token-images)
334342
tokenRequirement))
335343
(or (:criteria highest-role)

Diff for: ‎src/status_im/subs/communities_test.cljs

+47-44
Original file line numberDiff line numberDiff line change
@@ -383,35 +383,8 @@
383383
(let
384384
[checking-permissions? true
385385
token-image-eth "data:image/jpeg;base64,/9j/2w"
386-
community {:id community-id
387-
:checking-permissions? checking-permissions?
388-
:permissions {:access 3}
389-
:highest-permission-role constants/community-token-permission-become-admin
390-
:token-images {"ETH" token-image-eth}
391-
:name "Community super name"
392-
:chats {"89f98a1e-6776-4e5f-8626-8ab9f855253f"
393-
{:description "x"
394-
:emoji "🎲"
395-
:permissions {:access 1}
396-
:color "#88B0FF"
397-
:name "random"
398-
:categoryID "0c3c64e7-d56e-439b-a3fb-a946d83cb056"
399-
:id "89f98a1e-6776-4e5f-8626-8ab9f855253f"
400-
:position 4
401-
:can-post? false
402-
:members {"0x04" {"roles" [1]}}}
403-
"a076358e-4638-470e-a3fb-584d0a542ce6"
404-
{:description "General channel for the community"
405-
:emoji "🐷 "
406-
:permissions {:access 1}
407-
:color "#4360DF"
408-
:name "general"
409-
:categoryID "0c3c64e7-d56e-439b-a3fb-a946d83cb056"
410-
:id "a076358e-4638-470e-a3fb-584d0a542ce6"
411-
:position 0
412-
:can-post? false
413-
:members {"0x04" {"roles" [1]}}}}
414-
:token-permissions-check
386+
checks {:checking? checking-permissions?
387+
:check
415388
{:satisfied true
416389
:highestRole {:type constants/community-token-permission-become-admin
417390
:criteria [{:tokenRequirement [{:satisfied true
@@ -434,22 +407,52 @@
434407
[{:address "0xd722eaa60dc73e334b588d34ba66a3b27e537783"
435408
:chainIds nil}
436409
{:address "0x738d3146831c5871fa15872b409e8f360e341784"
437-
:chainIds [5 420]}]}
438-
:members {"0x04" {"roles" [1]}}
439-
:can-request-access? false
440-
:outroMessage "bla"
441-
:verified false}]
410+
:chainIds [5 420]}]}}
411+
community {:id community-id
412+
:checking-permissions? checking-permissions?
413+
:permissions {:access 3}
414+
:highest-permission-role constants/community-token-permission-become-admin
415+
:token-images {"ETH" token-image-eth}
416+
:name "Community super name"
417+
:chats {"89f98a1e-6776-4e5f-8626-8ab9f855253f"
418+
{:description "x"
419+
:emoji "🎲"
420+
:permissions {:access 1}
421+
:color "#88B0FF"
422+
:name "random"
423+
:categoryID "0c3c64e7-d56e-439b-a3fb-a946d83cb056"
424+
:id "89f98a1e-6776-4e5f-8626-8ab9f855253f"
425+
:position 4
426+
:can-post? false
427+
:members {"0x04" {"roles" [1]}}}
428+
"a076358e-4638-470e-a3fb-584d0a542ce6"
429+
{:description "General channel for the community"
430+
:emoji "🐷 "
431+
:permissions {:access 1}
432+
:color "#4360DF"
433+
:name "general"
434+
:categoryID "0c3c64e7-d56e-439b-a3fb-a946d83cb056"
435+
:id "a076358e-4638-470e-a3fb-584d0a542ce6"
436+
:position 0
437+
:can-post? false
438+
:members {"0x04" {"roles" [1]}}}}
439+
:members {"0x04" {"roles" [1]}}
440+
:can-request-access? false
441+
:outroMessage "bla"
442+
:verified false}]
442443
(swap! rf-db/app-db assoc-in [:communities community-id] community)
443-
(is (match? {:can-request-access? true
444-
:tokens [[{:symbol "DAI"
445-
:amount "5"
446-
:sufficient? true
447-
:loading? checking-permissions?}]
448-
[{:symbol "ETH"
449-
:amount "0.002"
450-
:sufficient? false
451-
:loading? checking-permissions?
452-
:img-src token-image-eth}]]}
444+
(swap! rf-db/app-db assoc-in [:communities/permissions-check community-id] checks)
445+
(is (match? {:can-request-access? true
446+
:networks-not-supported? nil
447+
:tokens [[{:symbol "DAI"
448+
:amount "5"
449+
:sufficient? true
450+
:loading? checking-permissions?}]
451+
[{:symbol "ETH"
452+
:amount "0.002"
453+
:sufficient? false
454+
:loading? checking-permissions?
455+
:img-src token-image-eth}]]}
453456
(rf/sub [sub-name community-id])))))
454457

455458
(h/deftest-sub :communities/airdrop-account

Diff for: ‎src/status_im/subs/root.cljs

+2
Original file line numberDiff line numberDiff line change
@@ -148,6 +148,8 @@
148148
(reg-root-key-sub :communities/selected-tab :communities/selected-tab)
149149
(reg-root-key-sub :contract-communities :contract-communities)
150150
(reg-root-key-sub :communities/permissioned-balances :communities/permissioned-balances)
151+
(reg-root-key-sub :communities/permissions-check :communities/permissions-check)
152+
(reg-root-key-sub :communities/channel-permissions-check :communities/channel-permissions-check)
151153

152154
;;activity center
153155
(reg-root-key-sub :activity-center :activity-center)

Diff for: ‎status-go-version.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"_comment": "Instead use: scripts/update-status-go.sh <rev>",
44
"owner": "status-im",
55
"repo": "status-go",
6-
"version": "chore/debug-token-permissions",
7-
"commit-sha1": "b7b7660a534a01099e55ee0e4253f6a9531c7f02",
8-
"src-sha256": "0nrmm3j9z6iwlr32mggd3xl63226drvvhrlrhrkgxcpgrgpixcfj"
6+
"version": "v0.174.5",
7+
"commit-sha1": "1ea2bd99d4c11f591df554c089aa9283b9742c59",
8+
"src-sha256": "0b9411581gmxrrrbgbjk34db8xgz5qlhvrhp9hngggar1b7vmp1w"
99
}

0 commit comments

Comments
 (0)