Amanda Olsen

Front End Developer User Experience Enthusiast


Thoughts on the industry

Notes from DevNexus 2019

Enjoy/use/peruse at your own risk.

Some of these notes were taken rather quickly and may be wrong or contain typos. Human stuff like that. Overall, should be helpful content.

JavaScript Cage Match between Map, Filter, Reduce, and Find

  1. Scott McAllister:
  2. Review of methods
    1. Map
      1. Runs a function against each element of an array and places each result into a single new array
    2. Filter
      1. Same as map, but removes array items which do not match criteria
    3. Reduce
      1. Just like map, except that it accumulates the values (however you specify) creating a single new value
    4. Find
      1. Like filter, but only returns one value, when the test critera is first met
  3. Performance
    1. Tool he recommends:
    2. This was run against an array of 1 million values, comparing the method to a for loop
      1. map – much slower than for loop
        1. Much slower in Chrome than Firefox
      2. filter – also slower
      3. reduce – much faster
        1. super fast – the best one
      4. find – about the same
    3. Most methods don’t run against arrays this large (in the browser), so the significance of these findings is unclear.
      1. Maybe this applies more in node.js where it might be more likely to use massive arrays? Even then, though, a million? Seems like a massive edge case.

Getting Started with Service Workers

  1. Jennifer Bland:
  2. Service worker: script your browser runs in the background separate from the page itself
    1. (Kind of like a browser extension!)
  3. Does offline and background functions, such as:
    1. Display an offline page
    2. Stores pages offline
    3. Store content in the cache
    4. Push notifications
    5. Background sync
  4. Browser support
    1. All good except for IE11 and below
    2. Probably just need some graceful degradation for IE11 and below
  5. Requirements, etc
    1. Https ONLY (and localhost)
    2. Controlled scope (can apply to some pages but not others)
    3. Can only run one service worker active at a time
      1. Per domain, right? The user can run 2 web sites at once which both have them, I assume?
  6. It “installs” then “activates”. After that it listens for “fetch” and “message”.
    1. That’s all! There are no other events.
  7. View her deck here:

Don’t Be Afraid of the JavaScript Stack Trace

  1. Jennifer Bland:
    1. – Jennifer’s training videos
  2. Terminology
    1. Javascript
      1. Single threaded programming language – it can only do one piece of code at a time
    2. Call stack
      1. First, it creates a call stack – a series of functions it will call in a particular order
      2. Last in first out method
    3. Heap
      1. Mostly unstructured region of memory
      2. Memory allocation to variables and objects happen here
    4. Queue
      1. List of messages to be processed and the associated callback function to execute
      2. Messages executed by call stack
      3. Message processing ends with stack is empty
    5. Concurrency model
  3. Stack trace (this is what you see in the console when an error happens)
    1. What functions were called
    2. In what order
    3. From which line and file
    4. With what arguments
  4. 5 levels of logging using console
    1. .debug
      1. By default is hidden in most browsers. Will need to change the setting to see it.
      2. Finds and locates the code for a particulr function
        1. Will open up the elements pane in dev tools when needed
      3. She highly recommends this one.
      4. Example
        1. If you know the problem function, in the console, run the function
        2. Then in the console, run debug(nameOfFunction)
    2. .info
    3. .log
    4. .warn
    5. .error
  5. console.table() – pretttttty awesome
    1. Displays objects as a table
    2. Click on headers to sort
    3. Works with objects of objects
    4. Can pass it an argument which states which fields/names you want if you don’t want all
  6. console.trace
    1. Very cool
    2. “(anonymous)” is always the bottom line in the stack trace because it’s in the global scope
    3. She recommends console.trace instead of using .log or any other consoles, so that you can see exactly what the code is doing.
    4. Why use it?
      1. Easer than writing a series of console.log
      2. Only have to remember to remove one line for production
      3. Shows file where it was called
      4. Shows line number where it was called
  7. Why do errors occur?
    1. EvalError
    2. InternalError
    3. RangeError
    4. ReferenceError
    5. SyntaxError
    6. TypeError
    7. URIError
    8. MyCustomError
  8. window.onerror()
    1. window.onerror = function(message, file, line, col, error) {
      // send crash information back to your servers
    2. Add this to your production code
    3. Because the users will have a different environment than mine, I want to know what errors they experience with the stack track. This is what window.onerror() does.
    4. Otherwise, we don’t know what error trace the user experienced.
    5. Loggong in the error on the server for future reference.
    6. window.addEventListener… could do this instead the window.onerror
  9. View her deck here:

A Practical-ish Guide to Data Science

  1. Mark West:
  2. software development + machine learning + traditional research = interdisciplinary part of data science
  3. The skill of story telling
  4. Roles in a data science project
    1. data scientist
    2. data engineer
    3. visual storyteller
    4. process owner
  5. Isn’t data science just a rebranding of business intelligence?
    1. No. It’s more of an evolution of BI.
  6. You’re giving the job of programming to the machine itself.
  7. The three main types of machine learning
    1. Supervised Learning
      1. Linear regression
      2. Decision tree (an if statement, or series of them)
    2. Unsupervised Learning
    3. Reinforcement Learning
      1. The output of the first process is rules for the next process to use. This is AI, I believe.
  8. You want to keep your model somewhat generic.
    1. Otherwise you have “overfitted” it.
  9. Python, very popular. He recommends this.
  10. This deck:

Share your thoughts

Your email address will not be published.

− two = 5