javascript
/
three.js
огледало од https://github.com/tazdij/three.js.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130
							<!DOCTYPE html>
<html lang="ko">

<head>
    <meta charset="utf-8">
    <base href="../../../" />
    <script src="page.js"></script>
    <link type="text/css" rel="stylesheet" href="page.css" />
</head>

<body>
    <h1>브라우저 지원([name])</h1>

    <h2>개요</h2>
    <div>
        <p>
            Three.js 는 WebGL을 통해 대부분의 현대 브라우저에서 scene을 렌더링할 수 있습니다. 오래된 브라우저, 특히 Internet Explorer 10 이하 버전에서는 다른
            [link:https://github.com/mrdoob/three.js/tree/master/examples/jsm/renderers 렌더러] (CSS2DRenderer,
            CSS3DRenderer, SVGRenderer)를 사용해야 합니다. 또한,
            polyfills를 몇가지 포함해야 할 수도 있는데 [link:https://github.com/mrdoob/three.js/tree/master/examples /examples] 폴더의
            파일을 불러올때에는 필수입니다.
        </p>
        <p>
            오래된 브라우저를 지원할 필요가 없다면, 다른 렌더러를 사용하는 것은 추천하지 않습니다. WebGLRenderer보다 느릴뿐더러 더 적은 기능을 지원하기 때문입니다.
        </p>
    </div>

    <h2>WebGL지원 웹 브라우저</h2>
    <div>
        <p>
            Google Chrome 9+, Firefox 4+, Opera 15+, Safari 5.1+, Internet Explorer 11 및 Microsoft Edge. [link:https://caniuse.com/#feat=webgl Can I use WebGL]에서 어떤 브라우저들이 지원하는지 확인해볼 수 있습니다.
        </p>
    </div>

    <h2>JavaScript 언어 특성 및 three.js에서 사용된 Web API</h2>
    <div>
        <p>
            three.js에서 사용된 특성들은 다음과 같습니다. 이 중 몇개는 추가로 polyfills가 필요합니다.
        </p>
        <table>
            <thead>
                <tr>
                    <th>특성</th>
                    <th>사용 범위</th>
                    <th>모듈</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Typed Arrays</td>
                    <td>Source</td>
                    <td>BufferAttribute, BufferGeometry, etc.</td>
                </tr>
                <tr>
                    <td>Web Audio API</td>
                    <td>Source</td>
                    <td>Audio, AudioContext, AudioListener, etc.</td>
                </tr>
                <tr>
                    <td>WebXR Device API</td>
                    <td>Source</td>
                    <td>WebXRManager</td>
                </tr>
                <tr>
                    <td>Blob</td>
                    <td>Source</td>
                    <td>FileLoader, etc.</td>
                </tr>
                <tr>
                    <td>Promise</td>
                    <td>Examples</td>
                    <td>GLTFLoader, DRACOLoader, BasisTextureLoader, GLTFExporter, VRButton, ARButton, etc.</td>
                </tr>
                <tr>
                    <td>Fetch</td>
                    <td>Examples</td>
                    <td>ImageBitmapLoader, etc.</td>
                </tr>
                <tr>
                    <td>File API</td>
                    <td>Examples</td>
                    <td>GLTFExporter, etc.</td>
                </tr>
                <tr>
                    <td>URL API</td>
                    <td>Examples</td>
                    <td>GLTFLoader, etc.</td>
                </tr>
                <tr>
                    <td>Pointer Lock API</td>
                    <td>Examples</td>
                    <td>PointerLockControls</td>
                </tr>
            </tbody>
        </table>
    </div>

    <h2>Polyfills</h2>
    <div>
        <p>필요에 따라 polyfills을 import 하세요. IE9를 예로들면 적어도 다음과 같은 polyfills가 필요할 것입니다.
            these features:</p>
        <ul>
            <li>Typed Arrays</li>
            <li>Blob</li>
        </ul>
    </div>

    <h3>추천 polyfills</h3>
    <div>
        <ul>
            <li>
                [link:https://github.com/zloirock/core-js core-js]
            </li>
            <li>
                [link:https://github.com/inexorabletash/polyfill/blob/master/typedarray.js typedarray.js]
            </li>
            <li>
                [link:https://github.com/stefanpenner/es6-promise/ ES6-Promise]
            </li>
            <li>
                [link:https://github.com/eligrey/Blob.js Blob.js]
            </li>
            <li>
                [link:https://github.com/github/fetch fetch]
            </li>
        </ul>
    </div>
</body>

</html>