title: RCTBridge required dispatch_sync to load RCTDevLoadingView. This may lead to deadlocks
body: <p>I get this in logs: </p>
  
  <blockquote>
    <p>RCTBridge required dispatch_sync to load RCTDevLoadingView. This may
    lead to deadlocks</p>
  </blockquote>
  
  <p>This is leading to an issue where the rendered content in React leads to alignment issues. </p>
  
  <p>(See attached screenshot 1) <a href="https://i.stack.imgur.com/tK0vC.png" rel="noreferrer">Screenshot with Issue</a></p>
  
  <p>This occurs randomly as all screens do not show alignment issues. </p>
  
  <p>(See attached Screenshot 2) <a href="https://i.stack.imgur.com/QGvzR.png" rel="noreferrer">Screenshot without issue </a></p>
  
  <p>I have used styled-components for Layout:</p>
  
  <pre><code>return(
    this.props.lastComponent ?
    &lt;CommentList marginLeft={this.props.marginLeft}&gt;
      &lt;CommentUserPicWrapper imageWidth={this.props.imageWidth}&gt;
        {this.props.imageType === 'URL' ? &lt;CommentUserPic source={{uri:this.props.uri}} imageWidth={this.props.imageWidth} onLoad={this.handleLoad}/&gt; : &lt;CommentUserPic source={require('../../img/defaultProfPic.png')} imageWidth={this.props.imageWidth} onLoad={this.handleLoad}/&gt;}
        {
          this.state.loading ? null : &lt;ActivityIndicator style={{position:'absolute'}}/&gt;
        }
      &lt;/CommentUserPicWrapper&gt;
      &lt;CommentDetails borderStatus={true} marginLeft={this.props.marginLeft}&gt;
        &lt;CommentUserName&gt;{this.props.userName} says&lt;/CommentUserName&gt;
        &lt;CommentUserContent&gt;{this.props.UserContent}&lt;/CommentUserContent&gt;
        &lt;CommentUserDate&gt;&lt;Text&gt;{this.props.commentDate}&lt;/Text&gt; at &lt;Text&gt;{this.props.commentTime}&lt;/Text&gt;MST&lt;/CommentUserDate&gt;
      &lt;/CommentDetails&gt;
      &lt;CommentReply onPress={this.replyClicked} borderStatus={true} underlayColor='transparent'&gt;
        &lt;CommentReplyText&gt;Reply&lt;/CommentReplyText&gt;
      &lt;/CommentReply&gt;
    &lt;/CommentList&gt;
    :
    &lt;CommentList marginLeft={this.props.marginLeft}&gt;
      &lt;CommentUserPicWrapper imageWidth={this.props.imageWidth}&gt;
        {this.props.imageType === 'URL' ? &lt;CommentUserPic source={{uri:this.props.uri}} imageWidth={this.props.imageWidth} onLoad={this.handleLoad}/&gt; : &lt;CommentUserPic source={require('../../img/defaultProfPic.png')} imageWidth={this.props.imageWidth} onLoad={this.handleLoad}/&gt;}
        {this.state.loading ? null : &lt;ActivityIndicator style={{position:'absolute'}}/&gt;}
      &lt;/CommentUserPicWrapper&gt;
      &lt;CommentDetails borderStatus={this.props.borderStatus} marginLeft={this.props.marginLeft}&gt;
        &lt;CommentUserName&gt;{this.props.userName} says&lt;/CommentUserName&gt;
        &lt;CommentUserContent&gt;{this.props.UserContent}&lt;/CommentUserContent&gt;
        &lt;CommentUserDate&gt;&lt;Text&gt;{this.props.commentDate}&lt;/Text&gt; at &lt;Text&gt;{this.props.commentTime}&lt;/Text&gt;MST&lt;/CommentUserDate&gt;
      &lt;/CommentDetails&gt;
      &lt;CommentReply onPress={this.replyClicked} borderStatus={this.props.borderStatus} underlayColor='transparent'&gt;
        &lt;CommentReplyText&gt;Reply&lt;/CommentReplyText&gt;
      &lt;/CommentReply&gt;
    &lt;/CommentList&gt;
  )
  </code></pre>
  
  <p>Thanks.</p>