Skip to content

Commit

Permalink
Remove code split modules and other dependent files favicon/css etc.
Browse files Browse the repository at this point in the history
  • Loading branch information
@jackerghan
jackerghan committed Aug 29, 2023
1 parent 47bf8c4 commit ba4c38e
Show file tree
Hide file tree
Showing 4 changed files with 98 additions and 204 deletions.
219 changes: 62 additions & 157 deletions assets/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,166 +7,71 @@
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>speedscope</title>
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
<script>
// https://github.com/evanw/webgl-recorder
false && (function () {
var getContext = HTMLCanvasElement.prototype.getContext;
var requestAnimationFrame = window.requestAnimationFrame;
var frameSincePageLoad = 0;

function countFrames() {
frameSincePageLoad++;
requestAnimationFrame(countFrames);
}

window.requestAnimationFrame = function () {
return requestAnimationFrame.apply(window, arguments);
};

HTMLCanvasElement.prototype.getContext = function (type) {
var canvas = this;
var context = getContext.apply(canvas, arguments);

if (type === 'webgl' || type === 'experimental-webgl') {
var oldWidth = canvas.width;
var oldHeight = canvas.height;
var oldFrameCount = frameSincePageLoad;
var trace = [];
var variables = {};
var fakeContext = {
trace: trace,
compileTrace: compileTrace,
downloadTrace: downloadTrace,
};

trace.push(' gl.canvas.width = ' + oldWidth + ';');
trace.push(' gl.canvas.height = ' + oldHeight + ';');

function compileTrace() {
var text = 'function* render(gl) {\n';
text += ' // Recorded using https://github.com/evanw/webgl-recorder\n';
for (var key in variables) {
text += ' var ' + key + 's = [];\n';
}
text += trace.join('\n');
text += '\n}\n';
return text;
}

function downloadTrace() {
var text = compileTrace();
var link = document.createElement('a');
link.href = URL.createObjectURL(new Blob([text], { type: 'application/javascript' }));
link.download = 'trace.js';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}

function getVariable(value) {
if (value instanceof WebGLActiveInfo ||
value instanceof WebGLBuffer ||
value instanceof WebGLFramebuffer ||
value instanceof WebGLProgram ||
value instanceof WebGLRenderbuffer ||
value instanceof WebGLShader ||
value instanceof WebGLShaderPrecisionFormat ||
value instanceof WebGLTexture ||
value instanceof WebGLUniformLocation) {
var name = value.constructor.name;
var list = variables[name] || (variables[name] = []);
var index = list.indexOf(value);

if (index === -1) {
index = list.length;
list.push(value);
}

return name + 's[' + index + ']';
}

return null;
}

console.timeStamp('start')
var start = performance.now()
for (var key in context) {
var value = context[key];

if (typeof value === 'function') {
fakeContext[key] = function (key, value) {
return function () {
trace.push(`// ${performance.now() - start}`)
var result = value.apply(context, arguments);
var args = [];

if (frameSincePageLoad !== oldFrameCount) {
oldFrameCount = frameSincePageLoad;
trace.push(' yield;');
}

if (canvas.width !== oldWidth || canvas.height !== oldHeight) {
oldWidth = canvas.width;
oldHeight = canvas.height;
trace.push(' gl.canvas.width = ' + oldWidth + ';');
trace.push(' gl.canvas.height = ' + oldHeight + ';');
}

for (var i = 0; i < arguments.length; i++) {
var arg = arguments[i];

if (typeof arg === 'number' || typeof arg === 'boolean' || typeof arg === 'string' || arg === null) {
args.push(JSON.stringify(arg));
}

else if (ArrayBuffer.isView(arg)) {
args.push('new ' + arg.constructor.name + '([' + Array.prototype.slice.call(arg) + '])');
}

else {
var variable = getVariable(arg);
if (variable !== null) {
args.push(variable);
}

else {
console.log('unsupported value:', arg);
args.push('null');
}
}
}

var text = 'gl.' + key + '(' + args.join(', ') + ');';
var variable = getVariable(result);
if (variable !== null) text = variable + ' = ' + text;
trace.push(' ' + text);

return result;
};
}(key, value);
}

else {
fakeContext[key] = value;
}
}

return fakeContext;
}

return context;
};

countFrames();
})();
</script>
<link rel="stylesheet" href="reset.css">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
</head>

<style>
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}

/* Prevent overscrolling */
/* https://stackoverflow.com/a/17899813 */
html {
overflow: hidden;
height: 100%;
}
body {
height: 100%;
overflow: auto;
}
</style>

<body>
<script src="../src/speedscope.tsx"></script>
</body>

</html>
</html>
14 changes: 7 additions & 7 deletions scripts/build-release.sh
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,22 +5,22 @@ set -euxo pipefail
OUTDIR=`pwd`/dist/release

# Typecheck
node_modules/.bin/tsc --noEmit
# node_modules/.bin/tsc --noEmit

# Run unit tests
npm run jest
# npm run jest

# Clean out the release directory
rm -rf "$OUTDIR"
mkdir -p "$OUTDIR"

# Place info about the current commit into the build dir to easily identify releases
npm ls -depth -1 | head -n 1 | cut -d' ' -f 1 > "$OUTDIR"/release.txt
date >> "$OUTDIR"/release.txt
git rev-parse HEAD >> "$OUTDIR"/release.txt
# npm ls -depth -1 | head -n 1 | cut -d' ' -f 1 > "$OUTDIR"/release.txt
# date >> "$OUTDIR"/release.txt
# git rev-parse HEAD >> "$OUTDIR"/release.txt

# Place a json schema for the file format into the build directory too
node scripts/generate-file-format-schema-json.js > "$OUTDIR"/file-format-schema.json
# node scripts/generate-file-format-schema-json.js > "$OUTDIR"/file-format-schema.json

# Build the compiled assets
node_modules/.bin/parcel build assets/index.html --no-cache --out-dir "$OUTDIR" --public-url "./" --detailed-report
node_modules/.bin/parcel build assets/index.html --no-cache --out-dir "$OUTDIR" --public-url "./" --detailed-report
26 changes: 13 additions & 13 deletions src/lib/profile.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import {lastOf, KeyedSet} from './utils'
import {ValueFormatter, RawValueFormatter} from './value-formatters'
import {FileFormat} from './file-format-spec'
import {h} from 'preact'
const demangleCppModule = import('./demangle-cpp')
// const demangleCppModule = import('./demangle-cpp')

export interface FrameData {
renderTooltip: () => h.JSX.Element
Expand Down Expand Up @@ -415,18 +415,18 @@ export class Profile {

// Demangle symbols for readability
async demangle() {
let demangleCpp: ((name: string) => string) | null = null

for (let frame of this.frames) {
// This function converts a mangled C++ name such as "__ZNK7Support6ColorFeqERKS0_"
// into a human-readable symbol (in this case "Support::ColorF::==(Support::ColorF&)")
if (frame.name.startsWith('__Z')) {
if (!demangleCpp) {
demangleCpp = (await demangleCppModule).demangleCpp
}
frame.name = demangleCpp(frame.name)
}
}
// let demangleCpp: ((name: string) => string) | null = null

// for (let frame of this.frames) {
// // This function converts a mangled C++ name such as "__ZNK7Support6ColorFeqERKS0_"
// // into a human-readable symbol (in this case "Support::ColorF::==(Support::ColorF&)")
// if (frame.name.startsWith('__Z')) {
// if (!demangleCpp) {
// demangleCpp = (await demangleCppModule).demangleCpp
// }
// frame.name = demangleCpp(frame.name)
// }
// }
}

remapSymbols(callback: SymbolRemapper) {
Expand Down
43 changes: 16 additions & 27 deletions src/views/application.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,23 +11,24 @@ import {ActiveProfileState} from '../app-state/active-profile-state'
import {LeftHeavyFlamechartView, ChronoFlamechartView} from './flamechart-view-container'
import {CanvasContext} from '../gl/canvas-context'
import {Toolbar} from './toolbar'
import {importJavaScriptSourceMapSymbolRemapper} from '../lib/js-source-map'
// import {importJavaScriptSourceMapSymbolRemapper} from '../lib/js-source-map'
import {Theme, withTheme} from './themes/theme'
import {ViewMode} from '../lib/view-mode'
import {canUseXHR} from '../app-state'
import {ProfileGroupState} from '../app-state/profile-group'
import {HashParams} from '../lib/hash-params'
import {StatelessComponent} from '../lib/preact-helpers'

const importModule = import('../import')
// const importModule = import('../import')
import * as importModule from '../import'

// Force eager loading of a few code-split modules.
//
// We put them all in one place so we can directly control the relative priority
// of these.
importModule.then(() => {})
import('../lib/demangle-cpp').then(() => {})
import('source-map').then(() => {})
// importModule.then(() => {})
// import('../lib/demangle-cpp').then(() => {})
// import('source-map').then(() => {})

async function importProfilesFromText(
fileName: string,
Expand Down Expand Up @@ -58,7 +59,7 @@ async function importFromFileSystemDirectoryEntry(entry: FileSystemDirectoryEntr
}

declare function require(x: string): any
const exampleProfileURL = require('../../sample/profiles/stackcollapse/perf-vertx-stacks-01-collapsed-all.txt')
// const exampleProfileURL = require('../../sample/profiles/stackcollapse/perf-vertx-stacks-01-collapsed-all.txt')

interface GLCanvasProps {
canvasContext: CanvasContext | null
Expand Down Expand Up @@ -267,14 +268,14 @@ export class Application extends StatelessComponent<ApplicationProps> {
symbolRemapper = emscriptenSymbolRemapper
}

const jsSourceMapRemapper = await importJavaScriptSourceMapSymbolRemapper(
fileContents,
file.name,
)
if (!symbolRemapper && jsSourceMapRemapper) {
console.log('Importing as JavaScript source map')
symbolRemapper = jsSourceMapRemapper
}
// const jsSourceMapRemapper = await importJavaScriptSourceMapSymbolRemapper(
// fileContents,
// file.name,
// )
// if (!symbolRemapper && jsSourceMapRemapper) {
// console.log('Importing as JavaScript source map')
// symbolRemapper = jsSourceMapRemapper
// }

if (symbolRemapper != null) {
return {
Expand All @@ -297,14 +298,6 @@ export class Application extends StatelessComponent<ApplicationProps> {
})
}

loadExample = () => {
this.loadProfile(async () => {
const filename = 'perf-vertx-stacks-01-collapsed-all.txt'
const data = await fetch(exampleProfileURL).then(resp => resp.text())
return await importProfilesFromText(filename, data)
})
}

onDrop = (ev: DragEvent) => {
this.props.setDragActive(false)
ev.preventDefault()
Expand Down Expand Up @@ -488,11 +481,7 @@ export class Application extends StatelessComponent<ApplicationProps> {
{canUseXHR ? (
<p className={css(style.landingP)}>
Drag and drop a profile file onto this window to get started, click the big blue
button below to browse for a profile to explore, or{' '}
<a tabIndex={0} className={css(style.link)} onClick={this.loadExample}>
click here
</a>{' '}
to load an example profile.
button below to browse for a profile to explore.
</p>
) : (
<p className={css(style.landingP)}>
Expand Down

0 comments on commit ba4c38e

Please sign in to comment.