JasonStoltz

Analyzing Web Performance

Overview

Web performance === How fast a web site loads

There are many factors, which affect web site performance:

• Servers and infrastructure (How fast is your hardware)
• Backend queries and code
• Networks (manged DNS - Dyn, Akamai network)

JasonStoltz

React and Redux patterns

Topics:

• Smart and Dumb components
• Stateless Functional components
• Pure Components
• Redux
• Containers and Components
• mapStateToProps and mapDispatchToProps
• Selectors

JasonStoltz

Scala

This is the model heirarchy i had envision in scala..

/* Anything that is an epixa resource */
trait ResourceLike {
  val $promise
  def $reload
  ...
}

JasonStoltz

(function(){
  var root = angular.element(document.body).injector().get('$rootScope');
  
  function children(scope) {
    var arr = [];
    var head = scope.$$childHead;
    if (head) {
      arr.push(head);
      ir = head.$$nextSibling;
      while(ir) {

JasonStoltz

function makeSoup(base){
  var ingredients = {
    base: base
  };

  var options = {
    withMushrooms: function(){
      ingredients.mushrooms = true;
      return this;
    },

JasonStoltz

/*
Sometimes, in angular, you'll want to wrap an object with some view presenter logic, but not modify the underlying resource.

If you try something like:
`server in serverRequests(requests.resources)` or `server in requests.resources|map:asServerRequest`, you will fail miserably. You will get some depth recursion errors of some sort. There's a reason for it, but I forget the details. The key is to put your wrapping logic an `ng-init`.
*/
<div ng-repeat="server in requests.resources" ng-init="serverRequest=asServerRequest(server)">
</div>

JasonStoltz

Inline expressions sort of suck because they're hard to debug... if you end up with a really long, unweildy filter, here's a way to debug them in the browser console.

ex. of lengthy expression:

<tr id="element" ng-repeat="resource in alertingEnvironment.environment.database_services.resources | map:'servers.resources' | flatten | unique:'id' | concat: alertingEnvironment.environment.servers.resources">
</tr>

function $eval(expr) {

JasonStoltz

lazy val webAggregateImpl = webAggregate := { mappings: Seq[PathMapping] =>
  def go(m: Seq[PathMapping], p: ResolvedProject): Seq[(File, String)] = {
    if (p.dependencies.isEmpty) {
      m
    } else {
      p.dependencies.map({ dep =>
        val subp = Project.getProjectForReference(dep.project, buildStructure.value).get
        /*
        At this point I have a http://www.scala-sbt.org/0.12.4/api/sbt/ResolvedProject.html ... so I can access project
        certain properties of the project, like base, id, etc.

JasonStoltz

def fibNum(pos: Int) = {
  def go(n: Int, curr: Int, next: Int): Int = {
    if (n == 0) curr
    else go(n-1, next, curr+next)
  }

  go(pos, 0, 1)
  
}

JasonStoltz

// modified from code of "JQuerify" bookmarklet
// http://www.learningjquery.com/2009/04/better-stronger-safer-jquerify-bookmarklet
(function() {
    function z(a, b) {
        var c = document.createElement("script");
        c.src = a;
        var d = document.getElementsByTagName("head")[0], e = !1;
        c.onload = c.onreadystatechange = function() {
            !e && (!this.readyState || this.readyState === "loaded" || this.readyState === "complete") && (e = !0, b(), c.onload = c.onreadystatechange = null, d.removeChild(c));
        };