this is page 2
hello
world
`;
8 | }
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/library-with-assets/src-publisher/src/index.ts:
--------------------------------------------------------------------------------
1 | import initWasm from './demo.wasm'
2 | import { blue, red } from './demo.module.css'
3 |
4 | export async function render(): Promisehello
world
`;
8 | }
--------------------------------------------------------------------------------
/packages/CSR/html-dependencies/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "html-dependencies",
3 | "private": true,
4 | "version": "1.0.0",
5 | "dependencies": {
6 | },
7 | "devDependencies": {
8 | "vite": "^2.9.1"
9 | },
10 | "scripts": {
11 | "dev": "vite dev",
12 | "build": "vite build",
13 | "preview": "vite preview"
14 | }
15 | }
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/inversion-of-control/demo-motherboard/src/plugin2.abstract.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent } from "vue";
2 |
3 | // interface declaration
4 | export const ComponentProvidedByPlugin2 = defineComponent({
5 | props: {
6 | position: {
7 | type: String,
8 | required: true
9 | }
10 | },
11 | methods: {} as any
12 | })
--------------------------------------------------------------------------------
/packages/SSR/generate-static-website/dist/website/assets/loadBackInitialState.8c7710d3.js:
--------------------------------------------------------------------------------
1 | import{_ as n}from"./index.e6166fda.js";let e;async function a(){return e||(e=await i()),e}async function i(){{const t="/website-config.js";return(await n(()=>import(t),[])).default}}function c(){const t=document.getElementById("initialState");return JSON.parse(t.content.textContent)}export{a as g,c as l};
2 |
--------------------------------------------------------------------------------
/packages/CSR/everything-in-js/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "everything-in-js",
3 | "private": true,
4 | "version": "1.0.0",
5 | "dependencies": {
6 | },
7 | "devDependencies": {
8 | "vite": "^2.9.1"
9 | },
10 | "scripts": {
11 | "dev": "vite dev",
12 | "build": "vite build --emptyOutDir",
13 | "preview": "vite preview"
14 | }
15 | }
--------------------------------------------------------------------------------
/packages/CSR/multiple-html-pages/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "multiple-html-pages",
3 | "private": true,
4 | "version": "1.0.0",
5 | "dependencies": {
6 | },
7 | "devDependencies": {
8 | "vite": "^2.9.1"
9 | },
10 | "scripts": {
11 | "dev": "vite dev",
12 | "build": "vite build --emptyOutDir",
13 | "preview": "vite preview"
14 | }
15 | }
--------------------------------------------------------------------------------
/packages/CSR/reduce-homepage-size/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "reduce-homepage-size",
3 | "private": true,
4 | "version": "1.0.0",
5 | "dependencies": {
6 | },
7 | "devDependencies": {
8 | "vite": "^2.9.1"
9 | },
10 | "scripts": {
11 | "dev": "vite dev",
12 | "build": "vite build --emptyOutDir",
13 | "preview": "vite preview"
14 | }
15 | }
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/multiple-ts-libs/cli/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "@multiple-ts-libs/cli",
3 | "private": true,
4 | "version": "1.0.0",
5 | "dependencies": {
6 | "@multiple-ts-libs/lib1": "workspace:*",
7 | "@multiple-ts-libs/lib2": "workspace:*"
8 | },
9 | "devDependencies": {
10 | },
11 | "bin": {
12 | "some-cli": "./some-cli.js"
13 | }
14 | }
--------------------------------------------------------------------------------
/packages/SSR/generate-static-website/dist/website/assets/page2.6b797fad.js:
--------------------------------------------------------------------------------
1 | import{l as a,g as i}from"./loadBackInitialState.8c7710d3.js";import"./index.e6166fda.js";async function c(){let t={content:""};t=a();const e=await i();return{title:"Page 2",view:`${t.content}
`,initialState:t,hydrate:()=>{document.body.addEventListener("click",()=>{alert(`clicked page 2
2 | `+e.someConfigKey)})}}}export{c as default};
3 |
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/library-with-assets/lib-publisher/vite.config.ts:
--------------------------------------------------------------------------------
1 | import { defineConfig } from 'vite'
2 |
3 | export default defineConfig({
4 | build: {
5 | lib: {
6 | entry: './src/index.ts',
7 | formats: ['es'],
8 | fileName: () => 'index.js'
9 | },
10 | outDir: 'dist',
11 | assetsInlineLimit: 0,
12 | },
13 | plugins: []
14 | })
--------------------------------------------------------------------------------
/packages/SSR/generate-static-website/dist/website/assets/page1.6e09e3c6.js:
--------------------------------------------------------------------------------
1 | import{l as i,g as a}from"./loadBackInitialState.8c7710d3.js";import"./index.e6166fda.js";async function c(){let t={content:""};t=i();const e=await a();return{title:"Page 1",view:`${t.content}
${e.someConfigKey}
`,initialState:t,hydrate:()=>{document.body.addEventListener("click",()=>{alert("clicked page 1")})}}}export{c as default};
2 |
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/inversion-of-control/demo-app/.gitignore:
--------------------------------------------------------------------------------
1 | # Logs
2 | logs
3 | *.log
4 | npm-debug.log*
5 | yarn-debug.log*
6 | yarn-error.log*
7 | pnpm-debug.log*
8 | lerna-debug.log*
9 |
10 | node_modules
11 | dist
12 | dist-ssr
13 | *.local
14 |
15 | # Editor directories and files
16 | .vscode/*
17 | !.vscode/extensions.json
18 | .idea
19 | .DS_Store
20 | *.suo
21 | *.ntvs*
22 | *.njsproj
23 | *.sln
24 | *.sw?
25 |
--------------------------------------------------------------------------------
/pnpm-workspace.yaml:
--------------------------------------------------------------------------------
1 | packages:
2 | - 'packages/CSR/*'
3 | - 'packages/SSR/*'
4 | - 'packages/DYNAMIC-LINKING/*'
5 | - 'packages/DYNAMIC-LINKING/hybrid-npm-package/*'
6 | - 'packages/DYNAMIC-LINKING/remote-package/*'
7 | - 'packages/STATIC-LINKING/*'
8 | - 'packages/STATIC-LINKING/library-with-assets/*'
9 | - 'packages/STATIC-LINKING/multiple-ts-libs/*'
10 | - 'packages/STATIC-LINKING/inversion-of-control/*'
--------------------------------------------------------------------------------
/packages/SSR/share-index-html/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/packages/SSR/share-index-html/server/server-entry.ts:
--------------------------------------------------------------------------------
1 | import express from 'express';
2 | import path from 'path';
3 | import server, { config } from './server';
4 | import fs from 'fs';
5 |
6 | config.indexHtml = fs.readFileSync(path.join(__dirname, 'client', 'index.html'), 'utf-8');
7 |
8 | const app = express();
9 | app.use('/assets', express.static(path.join(__dirname, 'client', 'assets')));
10 | app.use(server);
11 | app.listen(3000);
--------------------------------------------------------------------------------
/packages/DYNAMIC-LINKING/use-big-library-via-cdn/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "use-big-library-via-cdn",
3 | "private": true,
4 | "version": "1.0.0",
5 | "dependencies": {
6 | "monaco-editor": "0.33.0"
7 | },
8 | "devDependencies": {
9 | "vite": "^2.9.1"
10 | },
11 | "scripts": {
12 | "dev": "vite dev",
13 | "build": "vite build",
14 | "preview": "vite preview"
15 | }
16 | }
--------------------------------------------------------------------------------
/packages/SSR/python-django-server/client/vite.config.ts:
--------------------------------------------------------------------------------
1 | import { defineConfig, mergeConfig } from 'vite'
2 | import sharedConfig from '../vite.config';
3 |
4 | export default defineConfig(mergeConfig(sharedConfig, {
5 | build: {
6 | lib: {
7 | entry: './client-entry.js',
8 | formats: ['es'],
9 | fileName: () => 'client-entry.js'
10 | },
11 | outDir: '../dist/client'
12 | },
13 | }))
--------------------------------------------------------------------------------
/packages/CSR/react-tsx/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
11 | {
12 | viewModel.layers.map(layer =>
;
15 | });
16 |
--------------------------------------------------------------------------------
/packages/DYNAMIC-LINKING/remote-package/publisher/dist/assets/__federation_expose_PlusButton.js:
--------------------------------------------------------------------------------
1 | import {importShared} from './__federation_fn_import.js'
2 | const {store} = await importShared('remote-package-shared-store')
3 |
4 | function plusButton(target) {
5 | target.innerHTML = "";
6 | target.querySelector("button").addEventListener("click", () => {
7 | store.counter += 1;
8 | });
9 | }
10 |
11 | export { plusButton as default };
12 |
--------------------------------------------------------------------------------
/packages/DYNAMIC-LINKING/remote-package/publisher/dist/assets/__federation_expose_MinusButton.js:
--------------------------------------------------------------------------------
1 | import {importShared} from './__federation_fn_import.js'
2 | const {store} = await importShared('remote-package-shared-store')
3 |
4 | function minusButton(target) {
5 | target.innerHTML = "";
6 | target.querySelector("button").addEventListener("click", () => {
7 | store.counter -= 1;
8 | });
9 | }
10 |
11 | export { minusButton as default };
12 |
--------------------------------------------------------------------------------
/packages/SSR/generate-static-website/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "esnext",
4 | "module": "esnext",
5 | "moduleResolution": "node",
6 | "strict": true,
7 | "noEmit": true,
8 | "allowSyntheticDefaultImports": true,
9 | "types": ["express"],
10 | "lib": ["ESNext", "DOM"],
11 | },
12 | "include": [
13 | "server/**/*.ts",
14 | "client/**/*.ts"
15 | ]
16 | }
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/library-with-assets/lib-publisher/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "@library-with-assets/lib-publisher",
3 | "private": true,
4 | "version": "1.0.0",
5 | "main": "dist/index.js",
6 | "dependencies": {
7 | },
8 | "devDependencies": {
9 | "vite": "^2.9.1"
10 | },
11 | "files": ["dist", "src"],
12 | "scripts": {
13 | "dev": "vite build --watch",
14 | "build": "vite build --emptyOutDir"
15 | }
16 | }
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/multiple-ts-libs/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "multiple-ts-libs",
3 | "private": true,
4 | "version": "1.0.0",
5 | "dependencies": {
6 | },
7 | "devDependencies": {
8 | "npm-run-all": "^4.1.5",
9 | "typescript": "^4.6.4"
10 | },
11 | "scripts": {
12 | "dev": "run-p dev:**",
13 | "dev:cjs": "tsc -b libs.tsconfig.cjs.json --watch",
14 | "dev:esm": "tsc -b libs.tsconfig.json --watch"
15 | }
16 | }
--------------------------------------------------------------------------------
/packages/SSR/generate-static-website/dist/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/library-with-assets/lib-consumer/dist/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
8 | ===
9 |
13 | }
14 | })
--------------------------------------------------------------------------------
/packages/SSR/share-index-html/dist/client/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | HTML5 Example Page
12 |===header===
14 |
15 |
16 |
17 |
18 |
19 |
--------------------------------------------------------------------------------
/packages/DYNAMIC-LINKING/hybrid-npm-package/publisher/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "composite": true,
4 | "target": "esnext",
5 | "module": "esnext",
6 | "moduleResolution": "node",
7 | "incremental": true,
8 | "strict": true,
9 | "sourceMap": true,
10 | "declaration": true,
11 | "declarationDir": "dist/typings",
12 | "outDir": "dist/esm",
13 | "types": ["jest"],
14 | "lib": ["ESNext"]
15 | },
16 | "include": [
17 | "src/**/*.ts"
18 | ]
19 | }
--------------------------------------------------------------------------------
/packages/DYNAMIC-LINKING/remote-package/shared-store/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "composite": true,
4 | "target": "esnext",
5 | "module": "esnext",
6 | "moduleResolution": "node",
7 | "incremental": true,
8 | "strict": true,
9 | "sourceMap": true,
10 | "declaration": true,
11 | "declarationDir": "dist/typings",
12 | "outDir": "dist/esm",
13 | "types": ["jest"],
14 | "lib": ["ESNext"]
15 | },
16 | "include": [
17 | "src/**/*.ts"
18 | ]
19 | }
--------------------------------------------------------------------------------
/packages/DYNAMIC-LINKING/remote-package/consumer/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
11 | {
12 | viewModel.myValue = e.target.value;
13 | }} onFocus={() => {
14 | viewModel.isTyping = true;
15 | }} onBlur={() => {
16 | viewModel.isTyping = false;
17 | }}/>
18 | characters count: {viewModel.myValue.length}
19 |
;
20 | });
21 |
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/inversion-of-control/demo-motherboard/src/plugin1.abstract.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent } from "vue";
2 |
3 | // interface declaration
4 | export const ComponentProvidedByPlugin1 = defineComponent({
5 | props: {
6 | msg: {
7 | type: String,
8 | required: true
9 | }
10 | },
11 | data() {
12 | return {
13 | hello: ''
14 | }
15 | },
16 | methods: {
17 | onClick() {
18 | }
19 | }
20 | })
21 |
22 | export function spiExportedByPlugin1ForOtherPlugins(): string {
23 | throw new Error('abstract');
24 | }
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/inversion-of-control/demo-app/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "demo-app",
3 | "private": true,
4 | "version": "0.0.0",
5 | "scripts": {
6 | "dev": "vite",
7 | "build": "vue-tsc --noEmit && vite build",
8 | "preview": "vite preview"
9 | },
10 | "dependencies": {
11 | "vue": "^3.2.25",
12 | "demo-motherboard": "workspace:*",
13 | "demo-plugin1": "workspace:*",
14 | "demo-plugin2": "workspace:*"
15 | },
16 | "devDependencies": {
17 | "@vitejs/plugin-vue": "^2.2.0",
18 | "typescript": "^4.5.4",
19 | "vite": "^2.8.0",
20 | "vue-tsc": "^0.29.8"
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/library-with-assets/src-consumer/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | this is page 1
=== blah ===
===header===
18 | Contact Us
19 |
20 |
21 |
22 |
23 |
24 |
--------------------------------------------------------------------------------
/packages/STATIC-LINKING/inversion-of-control/demo-motherboard/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "esnext",
4 | "useDefineForClassFields": true,
5 | "module": "esnext",
6 | "moduleResolution": "node",
7 | "strict": true,
8 | "jsx": "react",
9 | "jsxFactory": "vue.h",
10 | "jsxFragmentFactory": "vue.Fragment",
11 | "sourceMap": true,
12 | "resolveJsonModule": true,
13 | "esModuleInterop": true,
14 | "lib": ["esnext", "dom"],
15 | "composite": true,
16 | "paths": {
17 | "@plugin1": ["./src/plugin1.abstract.ts"],
18 | "@plugin2": ["./src/plugin2.abstract.ts"]
19 | }
20 | },
21 | "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue", "ext/**/*.d.ts"]
22 | }
23 |
--------------------------------------------------------------------------------
/packages/CSR/multiple-html-pages/src/about/about.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | ===header===
18 | -
19 |
- Contact Us 20 |
- About 21 |
HTML5 Example Page
21 |HTML5 Example Page
21 |HTML5 Example Page
13 |
20 |
21 |
22 |
23 |
--------------------------------------------------------------------------------
/packages/CSR/react-tsx/src/App.css:
--------------------------------------------------------------------------------
1 | #root {
2 | max-width: 1280px;
3 | margin: 0 auto;
4 | padding: 2rem;
5 | text-align: center;
6 | }
7 |
8 | .logo {
9 | height: 6em;
10 | padding: 1.5em;
11 | will-change: filter;
12 | }
13 | .logo:hover {
14 | filter: drop-shadow(0 0 2em #646cffaa);
15 | }
16 | .logo.react:hover {
17 | filter: drop-shadow(0 0 2em #61dafbaa);
18 | }
19 |
20 | @keyframes logo-spin {
21 | from {
22 | transform: rotate(0deg);
23 | }
24 | to {
25 | transform: rotate(360deg);
26 | }
27 | }
28 |
29 | @media (prefers-reduced-motion: no-preference) {
30 | a:nth-of-type(2) .logo {
31 | animation: logo-spin infinite 20s linear;
32 | }
33 | }
34 |
35 | .card {
36 | padding: 2em;
37 | }
38 |
39 | .read-the-docs {
40 | color: #888;
41 | }
42 |
--------------------------------------------------------------------------------
/packages/CSR/multiple-html-pages/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | -
15 |
- Contact Us 16 |
- About 17 |
${initialState.content}
`,
17 | initialState,
18 | hydrate: () => {
19 | document.body.addEventListener('click', () => {
20 | alert('clicked page 2\n' + config.someConfigKey);
21 | })
22 | }
23 | }
24 | }
--------------------------------------------------------------------------------
/packages/SSR/generate-static-website/client/pages/page1.ts:
--------------------------------------------------------------------------------
1 | import { getWebsiteConfig } from "../getWebsiteConfig";
2 | import { loadBackInitialState } from "../loadBackInitialState"
3 | import './page1.css';
4 |
5 | export default async function() {
6 | let initialState = { content: '' }
7 | if (import.meta.env.SSR) {
8 | // simulate reading from database
9 | initialState.content = 'this is page 1'
10 | } else {
11 | initialState = loadBackInitialState();
12 | }
13 | const config = await getWebsiteConfig();
14 | return {
15 | title: 'Page 1',
16 | view: `${initialState.content}
${config.someConfigKey}
`,
17 | initialState,
18 | hydrate: () => {
19 | document.body.addEventListener('click', () => {
20 | alert('clicked page 1');
21 | })
22 | }
23 | }
24 | }
--------------------------------------------------------------------------------
/packages/SSR/generate-static-website/dist/ssr-manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "vite/modulepreload-polyfill": [],
3 | "vite/preload-helper": [],
4 | "client/render.ts": [],
5 | "client/client-entry.ts": [],
6 | "index.html": [],
7 | "client/pages/page1.css": [
8 | "/assets/page1.6e09e3c6.js",
9 | "/assets/page1.260c2d15.css"
10 | ],
11 | "client/pages/page1.ts": [
12 | "/assets/page1.6e09e3c6.js",
13 | "/assets/page1.260c2d15.css"
14 | ],
15 | "client/getWebsiteConfig.ts": [
16 | "/assets/loadBackInitialState.8c7710d3.js"
17 | ],
18 | "client/loadBackInitialState.ts": [
19 | "/assets/loadBackInitialState.8c7710d3.js"
20 | ],
21 | "client/pages/page2.css": [
22 | "/assets/page2.6b797fad.js",
23 | "/assets/page2.4cb761c5.css"
24 | ],
25 | "client/pages/page2.ts": [
26 | "/assets/page2.6b797fad.js",
27 | "/assets/page2.4cb761c5.css"
28 | ]
29 | }
--------------------------------------------------------------------------------
/packages/SSR/share-index-html/server/server.ts:
--------------------------------------------------------------------------------
1 | import bodyParser from 'body-parser';
2 | import express from 'express';
3 |
4 | export const config = { indexHtml: '' }
5 | const server = express.Router();
6 | server.use(bodyParser.urlencoded({ extended: false }));
7 | server.use(bodyParser.json());
8 |
9 | server.get('/', async (req, resp) => {
10 | const markerPos = config.indexHtml.indexOf('');
11 | if (markerPos === -1) {
12 | throw new Error('maker not found, can not inject server generated content');
13 | }
14 | resp.write(config.indexHtml.substring(0, markerPos));
15 | // we can stream output here as well
16 | resp.write(`
17 | HTML5 Example Page
19 |HTML5 Example Page
15 |
22 |
23 |
24 |
25 |
--------------------------------------------------------------------------------
/packages/SSR/generate-static-website/generate.js:
--------------------------------------------------------------------------------
1 | const vite = require('vite');
2 | const fs = require('fs');
3 | const path = require('path');
4 |
5 | async function main() {
6 | const { generateAllPages } = await loadModule('./server/generate.ts');
7 | const indexHtml = fs.readFileSync(
8 | path.join(__dirname, 'dist', 'index.html'), 'utf-8');
9 | const manifest = JSON.parse(fs.readFileSync(
10 | path.join(__dirname, 'dist', 'ssr-manifest.json'), 'utf-8'))
11 | await generateAllPages({
12 | outDir: path.join(__dirname, 'dist', 'website'),
13 | indexHtml,
14 | manifest
15 | });
16 | }
17 |
18 | async function loadModule(path) {
19 | const server = await vite.createServer({ server: { middlewareMode: 'ssr' } });
20 | try {
21 | return await server.ssrLoadModule(path);
22 | } finally {
23 | await server.close();
24 | }
25 | }
26 |
27 | main();
--------------------------------------------------------------------------------
/packages/SSR/python-django-server/server/server/urls.py:
--------------------------------------------------------------------------------
1 | """server URL Configuration
2 |
3 | The `urlpatterns` list routes URLs to views. For more information please see:
4 | https://docs.djangoproject.com/en/4.0/topics/http/urls/
5 | Examples:
6 | Function views
7 | 1. Add an import: from my_app import views
8 | 2. Add a URL to urlpatterns: path('', views.home, name='home')
9 | Class-based views
10 | 1. Add an import: from other_app.views import Home
11 | 2. Add a URL to urlpatterns: path('', Home.as_view(), name='home')
12 | Including another URLconf
13 | 1. Import the include() function: from django.urls import include, path
14 | 2. Add a URL to urlpatterns: path('blog/', include('blog.urls'))
15 | """
16 | from django.contrib import admin
17 | from django.urls import include, path
18 |
19 | urlpatterns = [
20 | path('', include('polls.urls')),
21 | path('admin/', admin.site.urls),
22 | ]
23 |
--------------------------------------------------------------------------------
/packages/CSR/html-dependencies/dist/assets/index.b15437e8.js:
--------------------------------------------------------------------------------
1 | const c=function(){const r=document.createElement("link").relList;if(r&&r.supports&&r.supports("modulepreload"))return;for(const e of document.querySelectorAll('link[rel="modulepreload"]'))i(e);new MutationObserver(e=>{for(const t of e)if(t.type==="childList")for(const o of t.addedNodes)o.tagName==="LINK"&&o.rel==="modulepreload"&&i(o)}).observe(document,{childList:!0,subtree:!0});function s(e){const t={};return e.integrity&&(t.integrity=e.integrity),e.referrerpolicy&&(t.referrerPolicy=e.referrerpolicy),e.crossorigin==="use-credentials"?t.credentials="include":e.crossorigin==="anonymous"?t.credentials="omit":t.credentials="same-origin",t}function i(e){if(e.ep)return;e.ep=!0;const t=s(e);fetch(e.href,t)}};c();const n=document.createElement("img");n.setAttribute("src",new URL("/assets/demo-dynamic.d3480e7a.svg",self.location).href);n.setAttribute("width","300");document.documentElement.appendChild(n);
2 |
--------------------------------------------------------------------------------
/packages/CSR/reduce-homepage-size/dist/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | -
15 |
- Page 1 19 |
- Page 2 23 |
- Page 2 (alt) 27 |
HTML5 Example Page
12 |ComponentProvidedByPlugin1
32 | }
33 | });
34 |
35 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2022 Tao Wen
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/packages/DYNAMIC-LINKING/use-big-library-via-cdn/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | -
23 |
- Page 1 27 |
- Page 2 31 |
- Page 2 (alt) 35 |
HTML5 Example Page
27 |hello
94 |this is blue
95 | ${demoJsonUrl} ${JSON.stringify(demoJson)}
96 | ${demoJsonRaw}
97 | ${JSON.stringify(pages)}
98 | `;
99 | async function loadWasm() {
100 | const { add } = await initWasm();
101 | console.log("1+1", add(1, 1));
102 | }
103 | loadWasm();
104 |
--------------------------------------------------------------------------------
/packages/CSR/everything-in-js/README.md:
--------------------------------------------------------------------------------
1 | # How to centralize logic/style and other related dependencies into one javascript file
2 |
3 | ## Code Structure & Motivation
4 |
5 | A typical client side rendering application is consisted by:
6 |
7 | * a nearly blank html file, referencing
8 | * a javascript entry file, which references
9 | * all other javascript files rendering the application pages
10 |
11 | The motivation to leave html blank, and move logic and style into javascript is to allow
12 |
13 | * Component reuse: html is not good at deduplicate repeated content structure
14 | * Shared layout: every page rendered from same javascript file makes sharing top level layout easier.
15 | * Make style, content, behavior close to each other, for better maintainability. It is more likely to keep names in sync
16 | * Declaractive style view enabled by framework like React
17 |
18 | ## DX Problems
19 |
20 | Stylesheet can only be declared in `