App.JS unnecessary render reduced

Author: zonayedpca

src/App.js

@@ -15,19 +15,25 @@ class App extends Component {
     singleData: ''
   }
 
-  async getData() {
-    const {data} = await axios('https://raw.githubusercontent.com/devsonket/devsonket.github.io/master/data/index.json');
-    this.setState({data})
+  getData() {
+    const data = axios('https://raw.githubusercontent.com/devsonket/devsonket.github.io/master/data/index.json');
+    return data;
   }
 
-  async topData() {
-    const {data: tops} = await axios('https://raw.githubusercontent.com/devsonket/devsonket.github.io/master/data/top.json');
-    this.setState({tops})
+  topData() {
+    const tops = axios('https://raw.githubusercontent.com/devsonket/devsonket.github.io/master/data/top.json');
+    return tops;
+  }
+
+  async getAllData() {
+    const data = this.getData();
+    const tops = this.topData();
+    const getAllData = await Promise.all([data, tops]);
+    this.setState({data: getAllData[0].data, tops: getAllData[1].data});
   }
 
   componentDidMount() {
-    this.getData();
-    this.topData();
+    this.getAllData();
   }
 
   searchAItem = (term) => {
@@ -40,7 +46,7 @@ class App extends Component {
   render() {
     const { searchAItem } = this;
     const { tops, searchResult, data } = this.state;
-
+    
     return (
       <BrowserRouter>
         <div className="App">