Обновление html -элемента заставляет pointerlockcontrols заикаться в Three.js ⇐ Javascript

[Anonymous]

В течение довольно долгого времени у меня была проблема в Three.js, где при вкладывании любых обновлений элементов HTML в моем цикле анимации у меня всегда есть странный заикание. Например: < /p>
function animate() {
renderer.render(scene, camera);
requestAnimationFrame(animate);
}
< /code>
работает совершенно нормально. PointerLockControls чувствует себя гладким, отзывчивым, а моя кадр-нормальная. < /P>
Но если я сделаю это: < /p>
function animate() {
document.querySelector("#some-element").textContent = "foobar";
renderer.render(scene, camera);
requestAnimationFrame(animate);
}
< /code>
Внезапно у Pointerlockcontrols есть странный эффект заикания, тогда как если я медленно указываю свой курсор, элементы управления застряли, но если я укажу свой курсор немного быстрее, элементы управления полностью дергаются на вершину экрана. Это просто PointerlockControls, ничего другого. Кроме того, мне нужно постоянно обновлять текстовый контент элемента, поэтому «обновлять его только тогда, когда мне нужно» не работает.


Подробнее здесь: https://stackoverflow.com/questions/796 ... n-three-js