diff --git a/bigbluebutton-html5/imports/ui/components/chat/alert/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/alert/component.jsx
index 923f1b97d5970f580c99747fc86cad3cc57e089f..2c9408a3929c50bb20fc83d249060286646003a6 100755
--- a/bigbluebutton-html5/imports/ui/components/chat/alert/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/alert/component.jsx
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import { defineMessages, injectIntl } from 'react-intl';
 import { Session } from 'meteor/session';
@@ -37,7 +37,7 @@ const intlMessages = defineMessages({
 const PUBLIC_KEY = 'public';
 const PRIVATE_KEY = 'private';
 
-class ChatAlert extends Component {
+class ChatAlert extends PureComponent {
   constructor(props) {
     super(props);
     this.state = {
diff --git a/bigbluebutton-html5/imports/ui/components/chat/alert/container.jsx b/bigbluebutton-html5/imports/ui/components/chat/alert/container.jsx
index b0bee3dd6be4cc6ed32f43f4d3adb455ef42f4a0..bddf44f9129003ca6e7aab793964abc4c6b561b7 100755
--- a/bigbluebutton-html5/imports/ui/components/chat/alert/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/alert/container.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { memo } from 'react';
 import { withTracker } from 'meteor/react-meteor-data';
 import UserListService from '/imports/ui/components/user-list/service';
 import Settings from '/imports/ui/services/settings';
@@ -18,4 +18,4 @@ export default withTracker(() => {
     openChats,
     publicUserId: Meteor.settings.public.chat.public_group_id,
   };
-})(ChatAlertContainer);
+})(memo(ChatAlertContainer));
diff --git a/bigbluebutton-html5/imports/ui/components/chat/alert/push-alert/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/alert/push-alert/component.jsx
index 42da64f9fe573163b034b3e5d1919d2484adc5be..562f7a0db1155fd3e34795370683a641ee6adb04 100755
--- a/bigbluebutton-html5/imports/ui/components/chat/alert/push-alert/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/alert/push-alert/component.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import _ from 'lodash';
 import injectNotify from '/imports/ui/components/toast/inject-notify/component';
@@ -15,7 +15,7 @@ const propTypes = {
   content: PropTypes.node.isRequired,
 };
 
-class ChatPushAlert extends React.Component {
+class ChatPushAlert extends PureComponent {
   static link(message, chatId) {
     return (
       <div
diff --git a/bigbluebutton-html5/imports/ui/components/chat/chat-dropdown/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/chat-dropdown/component.jsx
index 48433e1782a5cb6c800d9e63c335245b65f567cc..f4be63330d87acdf538131d003bd69214d1d1c85 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/chat-dropdown/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/chat-dropdown/component.jsx
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { PureComponent } from 'react';
 import { defineMessages, injectIntl } from 'react-intl';
 import { withModalMounter } from '/imports/ui/components/modal/service';
 import Clipboard from 'clipboard';
@@ -33,7 +33,7 @@ const intlMessages = defineMessages({
   },
 });
 
-class ChatDropdown extends Component {
+class ChatDropdown extends PureComponent {
   constructor(props) {
     super(props);
 
diff --git a/bigbluebutton-html5/imports/ui/components/chat/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/component.jsx
index 5da90dc22b2c6b3a153314d6014d52b65ae92a85..1554d7f32f147cc3bc1e121afe333b383a2c39c3 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/component.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { memo } from 'react';
 import PropTypes from 'prop-types';
 import { defineMessages, injectIntl } from 'react-intl';
 import injectWbResizeEvent from '/imports/ui/components/presentation/resize-wrapper/component';
@@ -109,7 +109,7 @@ const Chat = (props) => {
   );
 };
 
-export default withShortcutHelper(injectWbResizeEvent(injectIntl(Chat)), ['hidePrivateChat', 'closePrivateChat']);
+export default withShortcutHelper(injectWbResizeEvent(injectIntl(memo(Chat))), ['hidePrivateChat', 'closePrivateChat']);
 
 const propTypes = {
   chatID: PropTypes.string.isRequired,
diff --git a/bigbluebutton-html5/imports/ui/components/chat/container.jsx b/bigbluebutton-html5/imports/ui/components/chat/container.jsx
index 72b4ea33eb6092ed9c9641bdb35d952cba6d6179..a3406225cb69386284189e88b01894cd3923ea83 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/container.jsx
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { PureComponent } from 'react';
 import { defineMessages, injectIntl } from 'react-intl';
 import { withTracker } from 'meteor/react-meteor-data';
 import { Session } from 'meteor/session';
@@ -29,11 +29,12 @@ const intlMessages = defineMessages({
   },
 });
 
-class ChatContainer extends Component {
+class ChatContainer extends PureComponent {
   componentDidMount() {
     // in case of reopening a chat, need to make sure it's removed from closed list
     ChatService.removeFromClosedChatsSession();
   }
+
   render() {
     return (
       <Chat {...this.props}>
diff --git a/bigbluebutton-html5/imports/ui/components/chat/message-form/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/message-form/component.jsx
index 78bcc8081ed27b1ccc14ae0dcdc0358bc505bd76..85d0c213b78dd15b60ca99960488a23aaceb9de1 100755
--- a/bigbluebutton-html5/imports/ui/components/chat/message-form/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/message-form/component.jsx
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { PureComponent } from 'react';
 import { defineMessages, injectIntl } from 'react-intl';
 import cx from 'classnames';
 import TextareaAutosize from 'react-autosize-textarea';
@@ -32,7 +32,7 @@ const messages = defineMessages({
   },
 });
 
-class MessageForm extends Component {
+class MessageForm extends PureComponent {
   constructor(props) {
     super(props);
 
diff --git a/bigbluebutton-html5/imports/ui/components/chat/message-form/message-form-actions/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/message-form/message-form-actions/component.jsx
deleted file mode 100644
index 08da9326f032c7404ab64cc113f607894acafc6c..0000000000000000000000000000000000000000
--- a/bigbluebutton-html5/imports/ui/components/chat/message-form/message-form-actions/component.jsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import React from 'react';
-
-import Icon from '../../../icon/component';
-import BaseButton from '../../../button/base/component';
-
-const propTypes = {
-  ...BaseButton.propTypes,
-};
-
-const defaultProps = {
-  ...BaseButton.defaultProps,
-};
-
-const MessageFormActions = () => (
-  <BaseButton {...this.props}>
-    <Icon iconName={'add'} />
-  </BaseButton>
-);
-
-export default
-
-  MessageFormActions.propTypes = propTypes;
-MessageFormActions.defaultProps = defaultProps;
diff --git a/bigbluebutton-html5/imports/ui/components/chat/message-form/message-form-actions/styles.scss b/bigbluebutton-html5/imports/ui/components/chat/message-form/message-form-actions/styles.scss
deleted file mode 100644
index 0d56ef179f74efcc38d97be3cdc403754e4d82ca..0000000000000000000000000000000000000000
--- a/bigbluebutton-html5/imports/ui/components/chat/message-form/message-form-actions/styles.scss
+++ /dev/null
@@ -1 +0,0 @@
-@import "/imports/ui/stylesheets/variables/_all";
diff --git a/bigbluebutton-html5/imports/ui/components/chat/message-list/message-list-item/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/message-list/message-list-item/component.jsx
index 2f2d49e22ea6dfb4001333669bbd7036f01ec698..ba01f8f39b34eb4bef79b4e0fc0152e72d230dfa 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/message-list/message-list-item/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/message-list/message-list-item/component.jsx
@@ -25,13 +25,9 @@ const eventsToBeBound = [
 
 const isElementInViewport = (el) => {
   const rect = el.getBoundingClientRect();
-  const clientHeight = window.innerHeight || document.documentElement.clientHeight;
   const prefetchHeight = 125;
 
-  return (
-    rect.top >= -(prefetchHeight) &&
-    rect.bottom <= clientHeight + prefetchHeight
-  );
+  return (rect.top >= -(prefetchHeight) || rect.bottom >= -(prefetchHeight));
 };
 
 export default class MessageListItem extends Component {
diff --git a/bigbluebutton-html5/imports/ui/components/chat/message-list/message-list-item/message/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/message-list/message-list-item/message/component.jsx
index c946e6ceeb7c085841452ae408166feeeb52ea23..614d2f28869591e8e52ae9aa9e011faa0f969a2a 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/message-list/message-list-item/message/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/message-list/message-list-item/message/component.jsx
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import _ from 'lodash';
 
@@ -28,7 +28,7 @@ const isElementInViewport = (el) => {
   );
 };
 
-export default class MessageListItem extends Component {
+export default class MessageListItem extends PureComponent {
   constructor(props) {
     super(props);
 
diff --git a/bigbluebutton-html5/imports/ui/components/chat/service.js b/bigbluebutton-html5/imports/ui/components/chat/service.js
index 7fe19942af5a4bef2deff0befb0cc3f3a681e9f2..2dcf0e5dd8322a2f3a0b92e05845e5df25df76f8 100755
--- a/bigbluebutton-html5/imports/ui/components/chat/service.js
+++ b/bigbluebutton-html5/imports/ui/components/chat/service.js
@@ -45,7 +45,23 @@ const mapGroupMessage = (message) => {
   };
 
   if (message.sender !== SYSTEM_CHAT_TYPE) {
-    mappedMessage.sender = getUser(message.sender);
+    const sender = getUser(message.sender);
+
+    const {
+      color,
+      isModerator,
+      name,
+      isOnline,
+    } = sender;
+
+    const mappedSender = {
+      color,
+      isModerator,
+      name,
+      isOnline,
+    };
+
+    mappedMessage.sender = mappedSender;
   }
 
   return mappedMessage;