Skip to content

Instantly share code, notes, and snippets.

View axemclion's full-sized avatar

Parashuram N axemclion

View GitHub Profile
@axemclion
axemclion / chrome-selenium-timeline.js
Created September 19, 2015 04:06
Getting Chrome timeline from Selenium Log
var wd = require('wd');
// This is for Chromedriver directly.
// If you are using Selenium, use http://localhost:4444/wd/hub
var browser = wd.promiseRemote('http://localhost:9515');
var URL = 'http://islreview.com/'; // Change this to a custom URL
var config = {
"browserName": "chrome",
"chromeOptions": {
@axemclion
axemclion / index.js
Created September 7, 2015 02:23
Perfjankie - Scrolling custom element
var perfjankie = require('perfjankie');
var browserperf = require('perfjankie/node_modules/browser-perf');
perfjankie({
'url': 'http://localhost:8080',
'browsers': [{
'browserName': 'chrome'
}],
'selenium': 'http://localhost:9515',
'couch': {
'server': 'http://localhost:5984',
@axemclion
axemclion / browser-sync.js
Last active August 18, 2018 05:14
Using browser-sync with Cordova
// Browser-Sync support for Cordova projects
// To use this, add the following snippet as a after_run hook using something like
// <hook type="after_prepare" src="hooks/browser-sync.js" />
// Also add ws: 'unsafe-inline' to the CSP in index.html
// The do Cordova run, and changing anything in www/ will live-reload the cordova app on emulator/device
module.exports = function(context) {
if (context.opts.options[0] === '--browser-sync-mode') {
// Prepare was called by this script, so don't run the script again
return;
@axemclion
axemclion / perfjankie-ember-perf-js
Last active August 29, 2015 14:22
Performance monitoring for Ember versions
/*
Pre-req
- Ensure that you have ember-cli installed
- Clone https://github.com/wycats/dbmonster
- Run CouchDB to save the results
- Initialize the database using node_modules/.bin/perfjankie --couch-database=ember-perf --couch-user=admin_user --couch-pwd=admin_pass --only-update-site --couch-server=http://localhost:5984
To Run Tests
1. Update version of ember in bower.json
@axemclion
axemclion / ember-glimmer-dbmonster-perf.js
Last active August 29, 2015 14:21
Perf tests for Ember Glimmer implementation using DBMonster test app
/*
Ensure that you have ember-cli installed
Clone https://github.com/wycats/dbmonster
To Run Tests
1. Update version on ember to canary (components/ember#canary) or older versions
2. Run ember build --environment production
3. Run a HTTP server on dist directory, at port 8080
4. Run this file to collect data in _data.json
@axemclion
axemclion / Graph.png
Last active August 29, 2015 14:19
SVG Scroll tests
Graph.png
@axemclion
axemclion / .gitignore
Last active May 28, 2019 08:37
Protractor-Perf Example
*.log
node_modules/
@axemclion
axemclion / index.js
Last active March 13, 2020 09:00
DBMonster Perf Comparisons
var urls = {
react: 'http://run.plnkr.co/plunks/Wwgjjpl9NHMO5Nd1TUyN/',
ember: 'https://dbmonster.firebaseapp.com/',
underscore: 'http://jashkenas.github.io/dbmonster/',
ractive: 'http://www.rich-harris.co.uk/ractive-dbmonster/',
paperclip: 'http://paperclip-dbmonster.herokuapp.com/'
}
var browserPerf = require('browser-perf');
var FILE = 'data.json';
@axemclion
axemclion / index.js
Last active August 29, 2015 14:11
ScrollJank with WebPageTest
// More details in blog post at
/*****
http://bit.ly/wpt-scrolljank
*****/
var url = 'http://nparashuram.com/perfslides';
var wptUrl = 'http://192.168.254.21'; // Location of WPT instance
var POLLING_INTERVAL = 1000 * 10; // Look every 10 seconds
@axemclion
axemclion / README.md
Last active August 29, 2015 14:08
Article for Perfplanet

Automating Web Page Rendering Performance

Delivering web page content to users as quickly as possible is important. It is equally important to ensure that this downloaded content provides a smooth and responsive user experience. Page scrolls that are Janky, delays when typing in text boxes or choppy animations are just as bad as pages that take a long time to load. Users spend longer using the page than waiting for it to load and we should ensure that the page renders at 60 frames per second at all times.

Most modern web browsers have tools that could help identify the various things that could slow a web page down. However, rapid release cycles make it hard to do regular performance audits. Tools exist to automate network performance audits. It would be great to have a tool that automate the rendering perf audits too.

browser-perf

[