Displaying 1 to 20 from 24 results

browser-perf - Performance Metrics for Web Browsers

  •    Javascript

Read more on why browser-perf here. Please see the wiki pages for more information. You can find information about supported browsers, getting started, command line usage, reference for the Node API etc.

pwmetrics - Progressive web metrics at your fingertipz

  •    TypeScript

CLI tool and lib to gather performance metrics via Lighthouse. IN BETA.

sqip - "SQIP" (pronounced \skwɪb\ like the non-magical folk of magical descent) is a SVG-based LQIP technique

  •    Javascript

"SQIP" (pronounced \skwɪb\ like the non-magical folk of magical descent) is a SVG-based LQIP technique. After installing Primitive, you may also need to add the path to the Primitive binary file.

performance-bookmarklet - Performance-Bookmarklet helps to analyze the current page through the Resource Timing API, Navigation Timing API and User-Timing - requests by type, domain, load times, marks and more

  •    Javascript

Bookmarklet, Chrome Extension and Firefox add-on to analyze the current page through the Resource Timing API, Navigation Timing API and User-Timing - requests by type, domain, load times, marks and more - sort of a light live WebPageTest. You can use the Performance-Bookmarklet (renamed as Performance-Analyser since it's not a Bookmarklet) as Chrome Extension or Firefox add-on.




phantomas - PhantomJS-based web performance metrics collector and monitoring tool

  •    Javascript

You may need to install libfontconfig and libjpeg8 by running sudo apt-get install libfontconfig1 libjpeg8. phantomas comes as both command line tool and CommonJS module (see API docs) that you can use in your nodejs projects.

import-cost - displays the import size of the package you are importing inside the code editor

  •    Javascript

This extension will display inline in the editor the size of the imported package. The extension utilizes webpack with babili-webpack-plugin in order to detect the imported size. In this project we use lerna for managing the multiple packages.

analyze-css - CSS selectors complexity and performance analyzer

  •    Javascript

CSS selectors complexity and performance analyzer. analyze-css is built as a set of rules bound to events fired by CSS parser. Each rule can generate metrics and add "offenders" with more detailed information (see Usage section for an example). This will emit JSON formatted results on stdout. Use --pretty (or -p shortcut) option to make the output readable for human beings.


yall.js - A fast, flexible, and small image lazy loader!

  •    Javascript

yall.js is a featured-packed lazy loading script for <img>, <picture>, <video> and <iframe> elements. It works in all modern browsers including IE11. It uses Intersection Observer where available, but falls back to scroll, touchmove, resize, and orientationchange events where necessary. It can also monitor the DOM for changes using Mutation Observer to lazy load image elements that have been appended to the DOM after initial page render, which may be desirable for single page applications. It can also (optionally) optimize use of browser idle time using requestIdleCallback. To optimize decoding of <img> lazy loading for simple src and srcset use cases, yall.js uses Image.decode where available to decode images asynchronously before adding them to the DOM.

perfume

  •    TypeScript

Perfume is a JavaScript library for measuring Short and Long Script, First Contentful Paint (FCP), Time to Interactive (TTI), Component First Paint (CFM), annotating them to the DevTools timeline and reporting the results to Google Analytics.When a user navigates to a web page, they're typically looking for visual feedback to reassure them that everything is going to work as expected.

wpt-reporter - We use the webpage test reporter to drive WebPageTest.

  •    Javascript

Collect browser metrics using WebPageTest and choose how to report it. We wrap the functionality of the WebPageTest API and collect the most important metrics from the (giant) result JSON and report it as/to CSV/JSON/Graphite/statsv.We use it at Wikimedia to collect metrics, you can check our Grafana graphs here.

cssi - CSS Selector Scene Investigation

  •    HTML

In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using Grunt. Copyright (c) 2014 Mauricio Wolff Licensed under the MIT license.

grunt-reduce - A grunt kitchen that reduces your web ingredients down to their essence for optimal serving

  •    Javascript

Even though most browsers support inlining images through data-uris, spriting is sometimes still needed. grunt-reduce eases the pain of spriting considerably, down to a convenient little anotation in the image url of the images you want to sprite.

moniteur - Monitor asset size over time

  •    Javascript

For people who care about keeping an eye on their CSS and JavaScript file sizes. Configuration: edit the .moniteurrc.yml file in the current directory.

lighthouse-mocha-example - Sample using lighthouse and lighthouse-core with Mocha to run tests on your project/site

  •    Javascript

Using lighthouse and lighthouse-core with Mocha to run tests on your project/site. Indeed you can. See the included .travis.yml to give you a basic idea of how it works or see the screenshot below.

requestTracker - Track when your users get your HTTP requests

  •    Javascript

Using the Performance timeline API to retrieve HTTP requests from the browser. Information given in the callback are a merge of PerformanceEntry and PerformanceResourceTiming. If the browser does not support the Performance Observer API that allows to be warned every time a request has landed, the fallback is to retrieve the HTTP timeline every few seconds, at DOM ready and when the page is loaded.

PerfCascade - Responsive, SVG based HAR waterfall viewer

  •    TypeScript

Responsive, SVG based HAR waterfall viewer . PerfCascade is exported with UMD, so you can use it as global object, via AMD (e.g. requireJS) or commonJS (internally it uses ES6 modules).

atf - atf (above-the-fold) prints out above-the-fold css for whatever site you want.

  •    Javascript

atf (above-the-fold) prints out above-the-fold css for whatever site you want. PS: Doesn't work yet for styles loaded under SSL ¯_(ツ)_/¯.

discovery - Discoveries on Sustainable Loading research

  •    

Discoveries learned exploring Sustainable Loading for the web. Modern Web applications load code and data. Loading and processing (parsing, evaluating etc.) this data is not free, and negatively impacts the RAIL of the application. Further, as the apps become more complex, the code/data loading demands increase, and so does their impact. The impact becomes critical on mobile devices, leading to terrible user experience, unhappy users and developers.





We have large collection of open source products. Follow the tags from Tag Cloud >>


Open source products are scattered around the web. Please provide information about the open source projects you own / you use. Add Projects.