diff --git a/lib/shared/message-utils.js b/lib/shared/message-utils.js
--- a/lib/shared/message-utils.js
+++ b/lib/shared/message-utils.js
@@ -3,6 +3,7 @@
 import invariant from 'invariant';
 import _maxBy from 'lodash/fp/maxBy';
 import _orderBy from 'lodash/fp/orderBy';
+import * as React from 'react';
 
 import { useStringForUser } from '../hooks/ens-cache';
 import { userIDsToRelativeUserInfos } from '../selectors/user-selectors';
@@ -467,42 +468,56 @@
     threadIsGroupChat(threadInfo) ||
     threadInfo.name !== '' ||
     messageInfo?.creator.isViewer;
+  const shouldDisplayUser =
+    messageInfo?.type === messageTypes.TEXT && hasUsername;
 
   const stringForUser = useStringForUser(
-    messageInfo?.type === messageTypes.TEXT && hasUsername
-      ? messageInfo?.creator
-      : null,
+    shouldDisplayUser ? messageInfo?.creator : null,
   );
-  if (!messageInfo) {
-    return messageInfo;
-  }
 
-  let username = null;
-  if (messageInfo.type === messageTypes.TEXT && hasUsername) {
+  const { unread } = threadInfo.currentUser;
+  const username = React.useMemo(() => {
+    if (!shouldDisplayUser) {
+      return null;
+    }
     invariant(
       stringForUser,
       'useStringForUser should only return falsey if pass null or undefined',
     );
-    username = {
+    return {
       text: stringForUser,
-      style: 'secondary',
+      style: unread ? 'unread' : 'secondary',
     };
-  }
+  }, [shouldDisplayUser, stringForUser, unread]);
 
-  const messageTitle = getMessageTitle(messageInfo, threadInfo, markdownRules);
-  const message = {
-    text: messageTitle,
-    style: messageInfo.type === messageTypes.TEXT ? 'primary' : 'secondary',
-  };
+  const message = React.useMemo(() => {
+    if (!messageInfo) {
+      return messageInfo;
+    }
+    const messageTitle = getMessageTitle(
+      messageInfo,
+      threadInfo,
+      markdownRules,
+    );
 
-  if (threadInfo.currentUser.unread) {
-    message.style = 'unread';
-    if (username) {
-      username.style = 'unread';
+    let style;
+    if (unread) {
+      style = 'unread';
+    } else if (messageInfo.type === messageTypes.TEXT) {
+      style = 'primary';
+    } else {
+      style = 'secondary';
     }
-  }
 
-  return { message, username };
+    return { text: messageTitle, style };
+  }, [messageInfo, threadInfo, markdownRules, unread]);
+
+  return React.useMemo(() => {
+    if (!message) {
+      return message;
+    }
+    return { message, username };
+  }, [message, username]);
 }
 
 export {