diff --git a/src/CONST.js b/src/CONST.js
index 58df088ffc19..ef02585f6aed 100755
--- a/src/CONST.js
+++ b/src/CONST.js
@@ -496,11 +496,11 @@ const CONST = {
     ADD_PAYMENT_MENU_POSITION_X: 356,
     EMOJI_PICKER_SIZE: {
         WIDTH: 320,
-        HEIGHT: 400,
+        HEIGHT: 390,
     },
-    NON_NATIVE_EMOJI_PICKER_LIST_HEIGHT: 298,
+    NON_NATIVE_EMOJI_PICKER_LIST_HEIGHT: 288,
     EMOJI_PICKER_ITEM_HEIGHT: 32,
-    EMOJI_PICKER_HEADER_HEIGHT: 38,
+    EMOJI_PICKER_HEADER_HEIGHT: 32,
     COMPOSER_MAX_HEIGHT: 125,
     CHAT_FOOTER_MIN_HEIGHT: 65,
     CHAT_SKELETON_VIEW: {
diff --git a/src/components/EmojiPicker/EmojiPickerMenu/index.js b/src/components/EmojiPicker/EmojiPickerMenu/index.js
index ab68b51802c1..87e3356b7c72 100755
--- a/src/components/EmojiPicker/EmojiPickerMenu/index.js
+++ b/src/components/EmojiPicker/EmojiPickerMenu/index.js
@@ -87,6 +87,7 @@ class EmojiPickerMenu extends Component {
         this.onSelectionChange = this.onSelectionChange.bind(this);
         this.updatePreferredSkinTone = this.updatePreferredSkinTone.bind(this);
         this.setFirstNonHeaderIndex = this.setFirstNonHeaderIndex.bind(this);
+        this.getItemLayout = this.getItemLayout.bind(this);
 
         this.currentScrollOffset = 0;
         this.firstNonHeaderIndex = 0;
@@ -190,6 +191,20 @@ class EmojiPickerMenu extends Component {
         document.addEventListener('mousemove', this.mouseMoveHandler);
     }
 
+    /**
+     * This function will be used with FlatList getItemLayout property for optimization purpose that allows skipping
+     * the measurement of dynamic content if we know the size (height or width) of items ahead of time.
+     * Generate and return an object with properties length(height of each individual row),
+     * offset(distance of the current row from the top of the FlatList), index(current row index)
+     *
+     * @param {*} data FlatList item
+     * @param {Number} index row index
+     * @returns {Object}
+     */
+    getItemLayout(data, index) {
+        return {length: CONST.EMOJI_PICKER_ITEM_HEIGHT, offset: CONST.EMOJI_PICKER_ITEM_HEIGHT * index, index};
+    }
+
     /**
      * Cleanup all mouse/keydown event listeners that we've set up
      */
@@ -513,6 +528,7 @@ class EmojiPickerMenu extends Component {
                             }
                             stickyHeaderIndices={this.state.headerIndices}
                             onScroll={e => this.currentScrollOffset = e.nativeEvent.contentOffset.y}
+                            getItemLayout={this.getItemLayout}
                         />
                     )}
                 <EmojiSkinToneList
diff --git a/src/styles/styles.js b/src/styles/styles.js
index dd1496ea1924..56775eed51a5 100644
--- a/src/styles/styles.js
+++ b/src/styles/styles.js
@@ -1444,7 +1444,7 @@ const styles = {
     },
 
     emojiPickerList: {
-        height: 300,
+        height: 288,
         width: '100%',
         ...spacing.ph4,
     },
@@ -1455,7 +1455,9 @@ const styles = {
     emojiHeaderStyle: {
         backgroundColor: themeColors.componentBG,
         width: '100%',
-        ...spacing.pv3,
+        height: 32,
+        display: 'flex',
+        alignItems: 'center',
         fontFamily: fontFamily.EXP_NEUE_BOLD,
         fontWeight: fontWeightBold,
         color: themeColors.heading,