어느 시점에서 캔버스를 사용하는 것이 더 좋습니까?

Question

UI가 웹 기반이 될 응용 프로그램을 만들고 있습니다. 대상 브라우저는 Internet Explorer 전용입니다.

Canvas를 사용하고 표준 HTML 요소를 사용하는 대신 모든 요소를 ​​직접 그려야하는 UI가 궁금합니다.

HTML 요소로 할 수없는 일이있을 때만 캔버스를 사용해야하는 경우입니까?

이상적으로 토론이나 답변에 대한 링크와 그 이유를 설명하는 몇 가지 예를 찾고 있습니다. 그것이 단지 당신이 선호하는 것에 이르렀다면 말하라. 그렇지 않으면 어떤 고려 사항이 있습니까?

감사합니다.

Answer 1

제 답변을 "Does it make sense to create canvas-based UI components?" (으)로 읽어주십시오.

간단히 말해서 나쁜 생각입니다.

Canvas spec itself gives a laundry list of reasons why it is bad to make UI controls in canvas. 접근성은 악몽입니다. 사양을 인용하려면 :

작성자는 canvas 요소를 사용하여 텍스트 편집 컨트롤을 구현하지 않아야합니다. 이렇게하면 많은 단점이 있습니다.

• 마우스의 캐럿 배치를 다시 구현해야합니다.
• 캐럿의 키보드 이동을 다시 구현해야합니다 (여러 줄로 된 텍스트 입력의 경우 여러 줄에 걸쳐 가능할 수 있음).
• 텍스트 필드의 스크롤을 구현해야합니다 (긴 줄은 가로로, 여러 줄 입력은 세로로).
• 복사하여 붙여 넣기와 같은 기본 기능을 다시 구현해야합니다.
• 맞춤법 검사와 같은 기본 기능을 다시 구현해야합니다.
• 드래그 앤 드롭과 같은 기본 기능을 다시 구현해야합니다.
• 페이지 전체 텍스트 검색과 같은 기본 기능을 다시 구현해야합니다.
• 사용자 지정 텍스트 서비스와 같이 사용자에게 고유 한 기본 기능을 다시 구현해야합니다. 이것은 각 사용자마다 다른 서비스가 설치되어있을 가능성이 있으며 불가능한 서비스가있을 수 있습니다.
• 양방향 텍스트 편집을 다시 구현해야합니다.
• 여러 줄 문자 편집의 경우 모든 관련 언어에 줄 바꿈을 구현해야합니다.
• 텍스트 선택을 다시 구현해야합니다.
• 양방향 텍스트 선택 끌기를 다시 구현해야합니다.
• 플랫폼 기반 키보드 바로 가기를 다시 구현해야합니다.
• 플랫폼 고유 입력 방식 편집기 (IME)를 다시 구현해야합니다.
• 실행 취소 및 다시 실행 기능을 다시 구현해야합니다.
• 캐럿이나 선택 후의 배율과 같은 접근성 기능을 다시 구현해야합니다.
그것이 GPU 가속 캔버스가 빠른 소프트웨어 렌더링 기본 대조군보다 그릴 수있을 가능성이 가정 것

Answer 2

HTML 요소로 할 수없는 일이있을 때만 캔버스를 사용해야하는 경우입니까?

예, 그렇습니다. 캔버스는 현재 2D 및 향후 3D 용 도면 용입니다.

브라우저 기본 컨트롤이 인 경우 캔버스에서 그리는 것이 더 빠를 것이라고는 생각하지 않습니다. 기존 구현 위에 코드 층을 하나 이상 추가하고 있습니다.