Skip to content

Instantly share code, notes, and snippets.

@jacob-beltran

jacob-beltran/object-literals.js

Last active July 30, 2021 02:24
Show Gist options
  • Save jacob-beltran/7777a477942cbb2c9db65a1e3c312e88 to your computer and use it in GitHub Desktop.
Save jacob-beltran/7777a477942cbb2c9db65a1e3c312e88 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. jacob-beltran revised this gist Mar 6, 2017. No changes.
  2. jacob-beltran created this gist Mar 3, 2017.
    22 changes: 22 additions & 0 deletions object-literals.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,22 @@
    /*
    Object literals or Array literals are functionally equivalent to calling
    Object.create() or new Array(). This means that if object literals or
    array literals are passed as prop values, React will consider these to be new
    values for each render.
    This is problematic mostly when dealing with Radium or inline styles.
    */

    /* Bad */
    // New object literal for style each render
    render() {
    return <div style={ { backgroundColor: 'red' } }/>
    }

    /* Good */
    // Declare outside of component
    const style = { backgroundColor: 'red' };

    render() {
    return <div style={ style }/>
    }