1
\$\begingroup\$

fairly new to playing around with proxy servers. Wrote a really simple one with Express to help keep some API keys secret so that my front-end app can query the GitHub API. Definitely feels a bit clunky, but is working so far. I really haven't done performance testing before but the way this is implemented it seems like > 1 second round trip. I was wondering if anyone wouldn't mind taking a look and giving me some hints at some basic ways I could improve the performance. One thing I saw come up a few times was piping he request from the endpoint directly back to the requester, but so far I haven't been able to get that to work. Granted I haven't made a huge effort at that.

The proxy server itself is set up as follows:

// Express: ^4.17.1

const express = require('express');
const bodyParser = require('body-parser');
const axios = require('axios');
require('dotenv').config();

// Initialize app
const app = express();
const port = process.env.PORT || 3000;

// Configuration
app.use(bodyParser.json({ type: 'application/json' }))

// Constants
const id = process.env.GITHUB_CLIENT_ID;
const secret = process.env.GITHUB_CLIENT_SECRET;
const params = `?client_id=${id}&client_secret=${secret}`



// Route(s)
app.post('/profile', (req, res) => {
  const { username } = req.body;
  const endpoint = `https://api.github.com/users/${username}${params}`;

  axios({
    method: 'get',
    url: endpoint,
  })
    .then(response => {
      res.status(200)
      res.send(response.data)
    })
    .catch(error => {
      console.log('Error with Axios profile res: ', error)
      res.send({ error })
    })

  return
})

app.post('/repos', (req, res) => {
  const { username } = req.body;
  const endpoint = `https://api.github.com/users/${username}/repos${params}&per_page=100`;

  axios({
    method: 'get',
    url: endpoint,
  })
    .then(response => {
      res.status(200)
      res.send(response.data)
    })
    .catch(error => {
      console.log('Error with Axios repos res: ', error)
      res.send({ error })
    })

  return
})

// App is initialized using app.listen

On the frontend we have React, making requests that are proxied tot my server, where they pick up the API keys, and then the server makes a request to the endpoint on the GitHub API. The front-end is responsible for passing a username along to the endpoint. The relevant front-end code is as follows:

function getProfile(username) {
  return fetch('api/profile', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ 'username': username })
  })
    .then(res => res.json())
    .then(profile => {
      if (profile.message) {
        throw new Error(getErrorMsg(profile.message, username))
      }

      return profile
    })
}



function getRepos(username) {
  return fetch('api/repos', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ 'username': username })
  })
    .then(res => res.json())
    .then(repos => {
      if (repos.message) {
        throw new Error(getErrorMsg(repos.message, username))
      }

      return repos
    })
}

I can post the React code as well if necessary but it seems like React is not where a bottleneck would be originating - but I'm pretty green at this so that might be mistaken thinking on my part.

There are two requests being fired from the React application simultaneously, the end goal being a general comparison of two GitHub users. I've done this without the proxy and things definitely felt snappier, and I haven't really refactored anything on the front-end aside from pointing the requests at the proxy instead of directly at the GitHub API.

Thanks in advance for any tips!

\$\endgroup\$
  • 1
    \$\begingroup\$ You aren't doing anything expensive anywhere in the code. If you experience sluggishness, I bet it's just due to ping, which is unavoidable, not due to code issues \$\endgroup\$ – CertainPerformance May 5 at 3:40
  • \$\begingroup\$ Ok cool. Because I haven't ever really done legitimate performance testing, and given the scale of this application, I thought I would ask before digging into trying to time the requests. It didn't seem inherently expensive, but the little I read about piping requests directly back to front-end sounded like it would make at least part of the request's journey more direct. Thanks for taking a look. \$\endgroup\$ – Anthony May 5 at 16:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.