방문해 주셔서 감사합니다! 항상 행복하세요! - 문의사항은 메일 또는 댓글로 언제든 연락주세요. - "해줘","답 내놔" 같은 질문은 답변드리지 않습니다. - 메일주소 : lts06069@naver.com 리페인팅1 Javascript 에니메이션 (svg, canvas, gif)의 렌더링 개발간 반짝반짝(?) 거리는 아이콘이 필요하여 아래처럼 svg를 활용하여 제작을 해 보았습니다. svg 엘리먼트로는 circle과 text 및 animate를 사용 하였습니다. 이렇게 제작한 엘리먼트를 원하는 기능에 붙여서 사용을 하였는데.. 10개 내외정도만 사용할때는 문제가 없었습니다. 그러다가 대략 3,000개 이상을 웹 브라우저에 그렸는데 브라우저가 먹통이 되었습니다. 뭔일인지 보려고 개발도구를 켜 측정을 해보니 아래와 같은 상황이 벌어졌습니다. animate 엘리먼트를 통해서 브라우저에서 지속적인 렌더링이 이루어지다보니... 3천개나 되는 많은 갯수를 감당하지 못하고 메모리소비 + CPU점유가 발생 하였습니다. html canvas를 사용하여도 CPU에서의 연산이 계속 발생하므로 비슷하게 느렸습.. 2023. 1. 13. 이전 1 다음