title: How to increase axios speed?
body: <p>Because I'm new to using axios so I usually have a trouble in using it. Specifically, I'm making a <code>react-infinite-scroll</code> feature now, but when I compare its speed with other site, my post(<code>react-infinite-scroll</code> feature) is gonna be shown slowly a little. Then I'm thinking this problem is caused by 2 reasons<br>
  1. I'm not using <code>axios</code> properly<br>
  2. There is a thing makes <code>axios</code> speed urgrade, but I'm not using it<br>
  Here's my code, please give me some advice to increase my http request speed. </p>
  
  <p>Thank you for reading my question!</p>
  
  <pre><code>class MainPage extends Component {
  
      constructor(props) {
          super(props)
          axios.get("http://127.0.0.1:8000/api/question")
          .then(res =&gt; {
              this.setState({
                  AnswerPostMultiList: res.data
              })
            }
          )
          .catch(err =&gt; {
              console.log(err)
          })
      }
  
      state = {
          AnswerPostMultiList : []
      }
  
      componentDidMount() {
          window.addEventListener("scroll", this.handleScroll);
      }
  
      componentWillUnmount() {
          window.removeEventListener("scroll", this.handleScroll);
      }
  
      handleScroll = () =&gt; {
  
          console.log("scroll is executing")
  
          const { innerHeight } = window;
          const { scrollHeight } = document.body;
  
          const scrollTop =
            (document.documentElement &amp;&amp; document.documentElement.scrollTop) ||
            document.body.scrollTop;
  
          if (scrollHeight - innerHeight - scrollTop &lt; 1000 &amp;&amp; !this.props.isLoading["isLoading"]) {
            this.props.onIsLoading() #To prevent this code from calling back continuously, change the value of this.props.isLoading["isLoading"] to false 
  
                axios.get("http://127.0.0.1:8000/api/question")
                .then(res =&gt; {
  
                this.setState({
                    AnswerPostMultiList: this.state.AnswerPostMultiList.concat(res.data)
                })
                this.props.onIsLoading() #change the value of this.props.isLoading["isLoading"] to true 
              }
            )
            .catch(err =&gt; {
                console.log(err)
            })
          }
        };
  
      render() {
          return(
              &lt;&gt;
  
                  &lt;PageHeader /&gt;
                  &lt;div className="find_members"&gt;
                  { this.state.AnswerPostMultiList.map((answerpost,index) =&gt; {
                      return &lt;AnswerPostMulti question={answerpost.question_text} q_owner={answerpost.question_owner} answer={answerpost.answer_image} a_owner={answerpost.answer_owner} key={index} /&gt;
                    })
                  }
                  &lt;/div&gt;
  
              &lt;/&gt;
          )
      }
  }
  
  
  
  const mapDispatchToProps = (dispatch) =&gt; ({
      onIsLoading: () =&gt; {
          dispatch(isLoadingActions.isLoading())
      }
    })
  
    const mapStateToProps = state =&gt; ({
        isLoading: state.isLoading
    })
  
  
  export default connect(mapStateToProps, mapDispatchToProps)(MainPage)
  </code></pre>