Skip to content

Extract images from Chrome DevTools report.

License

Notifications You must be signed in to change notification settings

ilicmarko/devtools-timeline-images

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

29 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

logo

Devtools Timeline Exporter

npm

A really small utility to extract images from Chrome Timeline.

Installation

yarn global add devtools-timeline-images
# or NPM
npm i -g devtools-timeline-images

Usage

As of v2 CLI includes and alias for the name, dte (Devtools Timeline Export). This has been changed as in the future there is a plan to export videos, not only images.

Image

dte images <input> [options]

Generate sequence of images.

Options:
  --version     Show version number                                    [boolean]
  --output, -o  Path to JSON file generated by Chrome.       [string] [required]
  -h, --help    Show help                                              [boolean]

Also you can generate images with an alias i, like this: dte i <input> [options].

Video

With a video command you can instantly generate a slowdown video of the loading progress.

dte video <input> [options]

Generate slowdown video from the timeline export.

Options:
  --version     Show version number                                    [boolean]
  --output, -o  Video file name to export.                   [string] [required]
  -h, --help    Show help                                              [boolean]

Also you can generate a video with an alias v, like this: dte v <input> [options].

Options

  • -o or --output - Specify the output folder.

Note: If the output directory does not exist the CLI will create it.

Example

dte i ./example-site.json -o ./images

Save a recoding

Save recoding

More information at Google Developer Docs