Skip to content

Instantly share code, notes, and snippets.

@adrianbonnici

adrianbonnici/ama-resources.md

Created December 14, 2021 01:01
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save adrianbonnici/d9c4aa681d9db6c3dfa952bedcf4f15c to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save adrianbonnici/d9c4aa681d9db6c3dfa952bedcf4f15c to your computer and use it in GitHub Desktop.
Download ZIP
Raw
ama-resources.md

Learning Notes

Browser

1. Loading Performance

Performance Profile Report

2. Render Performance

3. Chrome DevTools

4. V8 Engine

5. RAIL Model

6. Security

7. DOM & CSS

JavaScript

1. Code review tips

This section is meant to serve as an example on how I personally keep track of feedback from various code reviews.

Examples

  1. Wrap console.log or throw new Error() for development related error messages in a: process.env.NODE_ENV !== ‘production’ condition.

  2. Alphabetise imports.

  3. You could use the following pattern so the reduce has a single return point:

const _fields = this.get('ticketFieldViews').reduce(
      (acc, fieldView) => {
        if (!fieldView.get('isDestroyed')) {
          ...
        }

        return acc;
      }
    )
  1. Optimisation: You should define a single callback function outside of the reduce instead of creating one for each field:
const isReactContainerViewEnabledCallback = () => false;

  1. You might want to move the declaration of allowList in the global space at the top of the file (as a constant) so JS does not have to reprocess it every time the setter is built.

  2. Those VOICE constants as well the array [VOICE_HOLD, VOICE_INBOUND, VOICE_OUTBOUND] should be defined at the global scope so we don't reprocess it every time:

const VOICE_ACTIVE_STATUSES = ['voice_hold', 'voice_inbound', 'voice_outbound'];
  1. No need to call Object.prototype.hasOwnProperty.call(), use the function available on the object instead:
ticketTab && ticketTab.hasOwnProperty('omnitabData');

  1. Please move Object.keys(eventChannelTypes) outside of the reduce loop.

  2. Keep a collection intuitive and also applying memoization / lazy invoking to expensive regex computation.

  3. Put parameters with a default value at the end of the parameter list in a function’s parameters list.

  4. Add a isDevelopment flag to indicate which code to be run in development mode only.

  5. Here’s another clever trick (not that I’d particularly recommend using this one 😆)

const myArray = [1, 2, 3];
const {length, [length - 1]: lastItem} = myArray;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment