diff --git a/index.html b/index.html
index 455d6a6..2f795bf 100644
--- a/index.html
+++ b/index.html
@@ -84,7 +84,7 @@
const networkTableBody = document.querySelector('#network-table tbody');
const networkDetail = document.querySelector('#network-detail');
const networkDetailEditor = new JSONEditor(networkDetail, {})
- const networkDetailDelaySeconds = 5;
+ const networkDetailDelaySeconds = 2;
let networkBucket = null;
function onNewNetworkData(raw) {
@@ -95,7 +95,7 @@
networkBucket = {};
for (const record of records) {
- const key = Math.round((record.timestamp - startTimestamp) / 1000);
+ const key = Math.floor((record.timestamp - startTimestamp) / 1000);
const bucket = networkBucket[key] || [];
bucket.push(record);
networkBucket[key] = bucket;
@@ -149,7 +149,9 @@
function networkOnSeek(elapsed) {
const rows = [];
- for (let currentTime = elapsed - networkDetailDelaySeconds; currentTime <= elapsed; currentTime++) {
+ const elapsedStart = elapsed - networkDetailDelaySeconds / 2;
+ const elapsedEnd = elapsed + networkDetailDelaySeconds / 2;
+ for (let currentTime = elapsedStart; currentTime <= elapsedEnd; currentTime++) {
const records = networkBucket[currentTime] || [];
for (let recordIdx = 0; recordIdx < records.length; recordIdx++) {
const record = records[recordIdx];
diff --git a/index.js b/index.js
index 50d4d4c..092092b 100644
--- a/index.js
+++ b/index.js
@@ -8,14 +8,16 @@ const fs = require('fs');
if (process.argv.length != 3) {
console.error(`Usage: ${process.argv[0]} ${process.argv[1]} `);
process.exit(1);
-}
+}
const url = process.argv[2];
(async () => {
const browser = await puppeteer.launch({
- headless: false, devtools: false, defaultViewport: null, args: [
+ headless: false, devtools: true, defaultViewport: null, args: [
"--start-fullscreen",
+ "--use-gl=angle",
+ "--use-angle=gl"
]
});
const page = await browser.newPage();
@@ -26,9 +28,6 @@ const url = process.argv[2];
await page.setUserAgent(customUA);
page.on('response', async response => {
- if (response.timing() === null) {
- return;
- }
const timestamp = Date.now();
const timing = response.timing();
const requestUrl = response.url();
@@ -55,10 +54,26 @@ const url = process.argv[2];
});
});
- const recorder = new PuppeteerScreenRecorder(page);
+ const recorder = new PuppeteerScreenRecorder(page, {
+ followNewTab: true,
+ fps: 30,
+ ffmpeg_Path: null,
+ videoFrame: {
+ width: null,
+ height: null,
+ },
+ videoCrf: 30,
+ videoCodec: 'libx264',
+ videoPreset: 'ultrafast',
+ videoBitrate: 1000,
+ aspectRatio: '16:9',
+ });
const reportName = `report_${new Date().toUTCString()}`;
+ const recorderStart = Date.now();
await recorder.start(`${reportName}.mp4`); // supports extension - mp4, avi, webm and mov
const startTimestamp = Date.now();
+
+ console.log(`Recorder start delay: ${startTimestamp - recorderStart}ms`)
console.log(`Going to ${url}`)
page.goto(url);