Skip to content

Commit 5c168fb

Browse files
texodustexodus
authored
Merge pull request #1647 from finos/custom-fonts
Parallelized `.wasm` download and deferred font loading
2 parents 0bd2cfc + 756c3cc commit 5c168fb

File tree

27 files changed

+429
-110
lines changed

27 files changed

+429
-110
lines changed

‎cpp/perspective/CMakeLists.txt‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -234,9 +234,6 @@ if (PSP_WASM_BUILD)
234234
include_directories("/boost_includes")
235235

236236
set(EXTENDED_FLAGS " \
237-
--bind \
238-
--source-map-base ./build/ \
239-
--memory-init-file 0 \
240237
-Wall \
241238
-fcolor-diagnostics \
242239
")
@@ -582,6 +579,9 @@ message("${BUILD_MESSAGE}\n")
582579

583580
if (PSP_WASM_BUILD)
584581
set(CMAKE_EXE_LINKER_FLAGS "${CMAKE_EXE_LINKER_FLAGS} \
582+
--bind \
583+
--source-map-base=\"\" \
584+
--memory-init-file 0 \
585585
-s EXPORT_ES6=1 \
586586
-s NO_EXIT_RUNTIME=1 \
587587
-s NO_FILESYSTEM=1 \

‎cpp/perspective/src/cpp/view.cpp‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -728,7 +728,7 @@ View<CTX_T>::data_slice_to_arrow(
728728
buffer = *allocated;
729729
arrow::io::BufferOutputStream sink(buffer);
730730
auto options = arrow::ipc::IpcWriteOptions::Defaults();
731-
auto res = arrow::ipc::NewStreamWriter(&sink, arrow_schema, options);
731+
auto res = arrow::ipc::MakeStreamWriter(&sink, arrow_schema, options);
732732
#endif
733733

734734
std::shared_ptr<arrow::ipc::RecordBatchWriter> writer = *res;

‎examples/blocks/dist.js‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,16 +4,18 @@ const fs = require("fs");
44
const hashes = JSON.parse(fs.readFileSync("gists.json"));
55

66
const replacements = {
7-
"/node_modules/": "https://unpkg.com/",
8-
"perspective-viewer-datagrid/dist/umd/perspective-viewer-datagrid.js":
9-
"perspective-viewer-datagrid",
10-
"perspective-viewer-d3fc/dist/umd/perspective-viewer-d3fc.js":
11-
"perspective-viewer-d3fc",
7+
"/node_modules/": "https://cdn.jsdelivr.net/npm/",
128

139
// TODO jsdelivr has slightly different logic for trailing '/' that causes
1410
// the wasm assets to not load correctly when using aliases ..
1511

1612
// "perspective/dist/umd/perspective.js": "perspective"
13+
"perspective/dist/cdn/perspective.js": "perspective",
14+
"perspective-viewer/dist/cdn/perspective-viewer.js": "perspective-viewer",
15+
"perspective-viewer-datagrid/dist/cdn/perspective-viewer-datagrid.js":
16+
"perspective-viewer-datagrid",
17+
"perspective-viewer-d3fc/dist/cdn/perspective-viewer-d3fc.js":
18+
"perspective-viewer-d3fc",
1719
};
1820

1921
execute`mkdir -p dist`;

‎examples/blocks/src/editable/index.html‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,6 @@
1212
<head>
1313
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"/>
1414

15-
<script src="https://cdn.jsdelivr.net/npm/webfontloader"></script>
16-
<script>WebFont.load({google: {families: ["Roboto Mono:200,400","Material Icons","Open Sans:300,400"]}});</script>
17-
1815
<script type="module" src="/node_modules/@finos/perspective/dist/cdn/perspective.js"></script>
1916
<script type="module" src="/node_modules/@finos/perspective-viewer/dist/cdn/perspective-viewer.js"></script>
2017
<script type="module" src="/node_modules/@finos/perspective-viewer-datagrid/dist/cdn/perspective-viewer-datagrid.js"></script>
@@ -37,7 +34,7 @@
3734
el.toggleConfig();
3835
}
3936

40-
window.addEventListener("DOMContentLoaded", load);
37+
load();
4138

4239
</script>
4340

@@ -46,8 +43,8 @@
4643
position: absolute;
4744
top: 0;
4845
left: 0;
49-
right: 0;
5046
bottom: 0;
47+
right: 0;
5148
}
5249
</style>
5350
</head>

‎examples/react/src/index.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,8 @@ import "@finos/perspective-viewer";
1515
import "@finos/perspective-viewer-datagrid";
1616
import "@finos/perspective-viewer-d3fc";
1717
import {
18-
PerspectiveViewerConfig,
19-
PerspectiveViewerElement,
18+
HTMLPerspectiveViewerConfig,
19+
HTMLPerspectiveViewerElement,
2020
} from "@finos/perspective-viewer";
2121

2222
import "./index.css";
@@ -30,12 +30,12 @@ const getTable = async (): Promise<perspective.Table> => {
3030
return await worker.table(buffer as any);
3131
};
3232

33-
const config: PerspectiveViewerConfig = {
33+
const config: HTMLPerspectiveViewerConfig = {
3434
row_pivots: ["State"],
3535
};
3636

3737
const App = (): React.ReactElement => {
38-
const viewer = React.useRef<PerspectiveViewerElement>(null);
38+
const viewer = React.useRef<HTMLPerspectiveViewerElement>(null);
3939

4040
React.useEffect(() => {
4141
getTable().then((table) => {

‎examples/webpack-cross-origin/src/index.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,10 @@
77
*
88
*/
99

10-
import perspective from "@finos/perspective/dist/esm/perspective.parallel.js";
1110
import "./index.css";
11+
12+
import perspective from "@finos/perspective";
13+
1214
import "@finos/perspective-viewer";
1315
import "@finos/perspective-viewer-datagrid";
1416
import "@finos/perspective-viewer-d3fc";

‎packages/perspective/build.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ const BUILD = [
1313
global: "window",
1414
},
1515
format: "esm",
16-
entryPoints: ["src/js/perspective.parallel.js"],
16+
entryPoints: ["src/js/perspective.browser.js"],
1717
plugins: [NodeModulesExternal()],
1818
external: ["*.wasm", "*.worker.js"],
1919
outfile: "dist/esm/perspective.js",
@@ -29,7 +29,7 @@ const BUILD = [
2929
global: "window",
3030
},
3131
format: "esm",
32-
entryPoints: ["src/js/perspective.parallel.js"],
32+
entryPoints: ["src/js/perspective.browser.js"],
3333
plugins: [WasmPlugin(false), WorkerPlugin(false)],
3434
outfile: "dist/cdn/perspective.js",
3535
},
@@ -40,7 +40,7 @@ const BUILD = [
4040
globalName: "perspective",
4141
footer: {js: "window.perspective=perspective;"},
4242
format: "cjs",
43-
entryPoints: ["src/js/perspective.parallel.js"],
43+
entryPoints: ["src/js/perspective.browser.js"],
4444
plugins: [WasmPlugin(true), WorkerPlugin(true), UMDLoader()],
4545
outfile: "dist/umd/perspective.js",
4646
},

packages/perspective/src/js/perspective.parallel.js renamed to packages/perspective/src/js/perspective.browser.js

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -37,10 +37,12 @@ const _override = /* @__PURE__ */ (function () {
3737
}
3838

3939
async wasm() {
40-
const _wasm = wasm;
40+
const _wasm = await wasm;
4141
if (_wasm.buffer && _wasm.buffer instanceof ArrayBuffer) {
4242
console.warn(INLINE_WARNING);
4343
this._wasm = _wasm;
44+
} else if (_wasm instanceof ArrayBuffer) {
45+
this._wasm = _wasm;
4446
} else {
4547
const req = await fetch(_wasm);
4648
this._wasm = await req.arrayBuffer();
@@ -156,22 +158,14 @@ const WORKER_SINGLETON = /* @__PURE__ */ (function () {
156158
};
157159
})();
158160

159-
/**
160-
* If Perspective is loaded with the `preload` attribute, pre-initialize the
161-
* worker so it is available at page render.
162-
*/
163-
if (document.currentScript && document.currentScript.hasAttribute("preload")) {
164-
WORKER_SINGLETON.getInstance();
165-
}
166-
167161
export const get_type_config = _get_type_config;
168162

169163
export function override(x) {
170164
return _override().set(x);
171165
}
172166

173167
/**
174-
* Create a new WebWorkerClient instance. s
168+
* Create a new WebWorkerClient instance.
175169
* @param {*} [config] An optional perspective config object override
176170
*/
177171
export function worker(config) {
@@ -188,6 +182,11 @@ export function websocket(url = window.location.origin.replace("http", "ws")) {
188182
return new WebSocketClient(new WebSocket(url));
189183
}
190184

185+
/**
186+
* Return the shared worker, the original WebWorkerClient created during module
187+
* load.
188+
* @param {*} [config] An optional perspective config object override
189+
*/
191190
export function shared_worker(config) {
192191
return WORKER_SINGLETON.getInstance(config);
193192
}

‎packages/perspective/src/js/perspective.node.js‎

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -25,18 +25,22 @@ const load_perspective =
2525
require("../../dist/pkg/cjs/perspective.cpp.js").default;
2626

2727
const LOCAL_PATH = path.join(process.cwd(), "node_modules");
28-
const buffer = require("@finos/perspective/pkg/cjs/perspective.cpp.wasm")
29-
.default.buffer;
28+
const buffer =
29+
require("@finos/perspective/pkg/cjs/perspective.cpp.wasm").default;
3030

3131
const SYNC_SERVER = new (class extends Server {
3232
init(msg) {
33-
load_perspective({
34-
wasmBinary: buffer,
35-
wasmJSMethod: "native-wasm",
36-
}).then((core) => {
37-
this.perspective = perspective(core);
38-
super.init(msg);
39-
});
33+
buffer
34+
.then((buffer) =>
35+
load_perspective({
36+
wasmBinary: buffer,
37+
wasmJSMethod: "native-wasm",
38+
})
39+
)
40+
.then((core) => {
41+
this.perspective = perspective(core);
42+
super.init(msg);
43+
});
4044
}
4145

4246
post(msg) {

‎rust/perspective-viewer/Cargo.toml‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,10 @@ features = [
5757
"Event",
5858
"EventTarget",
5959
"EventListener",
60+
"FontFace",
61+
"FontFaceSet",
62+
"FontFaceSetIterator",
63+
"FontFaceSetIteratorResult",
6064
# "DocumentFragment",
6165
"HtmlCollection",
6266
"HtmlElement",

0 commit comments

Comments
 (0)