xfy/DefectingCat.github.io
1
0
Fork 0
mirror of https://github.com/DefectingCat/DefectingCat.github.io synced 2025-07-16 01:01:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add lazy import in post

Browse Source
This commit is contained in:
Defectink
2022-04-13 17:37:27 +08:00
parent 1011f065b5
commit 54e412b339
2 changed files with 12 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
pages/p/hello-world.mdx
View File

@ -5,7 +5,11 @@ tags: ['Hello world']
---
import Layout from 'layouts/MDXLayout.tsx';
import RUASandpack from 'components/RUA/RUASandpack.tsx';
import dynamic from 'next/dynamic';
export const RUASandpack = dynamic(() =>
import('components/RUA/RUASandpack.tsx')
);
export const meta = {
title: 'Hello world',

10
pages/p/how-to-load-a-background-with-threejs.mdx
View File

@ -5,7 +5,11 @@ tags: ['three.js', 'JavaScript']
---
import Layout from 'layouts/MDXLayout.tsx';
import RUASandpack from 'components/RUA/RUASandpack.tsx';
import dynamic from 'next/dynamic';
export const RUASandpack = dynamic(() =>
import('components/RUA/RUASandpack.tsx')
);
export const meta = {
title: 'How to load a background with three.js',
@ -60,7 +64,7 @@ export const main = `import { useEffect, useRef } from 'react';
import * as THREE from 'three';
export default function App() {
const ref = useRef<HTMLCanvasElement>(null);
const ref = useRef(null);
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(
75,
@ -70,7 +74,7 @@ export default function App() {
);
useEffect(() => {
const renderer = new THREE.WebGLRenderer({
canvas: ref.current!,
canvas: ref.current,
});
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(window.innerWidth, window.innerHeight);