정말 빠른 이미지 생성

Question

나는 웹에서 글꼴을 미리 볼 수있는 응용 프로그램을 만들고 있는데, 이는 myfonts과 같습니다. 누구나 그렇게 빨리하는 법을 아십니까?

내 방법은 HTML5 캔버스와 일부 자바 스크립트를 사용하여 글꼴 미리보기를 생성하는 것입니다. 이것은 서버 측에서 PHP GD 라이브러리 나 Imageick을 사용하여 이미지를 생성하는 대신에 사용할 수 있습니다.

그러나 HTML5 캔버스를 사용하면 빠르게 밝아 지지만 모든 처리는 클라이언트 측에서 수행됩니다. 방법에

 $('#draw').click(function() { 
      var canvas = $('canvas')[0], 
      ctx = canvas.getContext('2d'); 
      ctx.font = '12px "Press Start 2P"'; 
      ctx.fillStyle = '#000'; 
      ctx.fillText('Hello, world!', x, y += 20); 
      ctx.fillRect(x - 20, y - 10, 10, 10); 
     }); 

모든 아이디어 : 캔버스에 렌더링

@font-face { 
     font-family: 'Press Start 2P'; 
     src: url('fonts/PressStart2P.ttf'); 
    } 

그리고 JS를 사용 : 나는 글꼴을로드 할 글꼴의 얼굴을 사용하기 때문에 내가로드 글꼴을 숨기는 데 문제가 있어요 글꼴 경로를 비밀로 유지하거나 이미지를 생성하는 다른 방법을 정말 빠르게 유지할 수 있습니다. 각 페이지에 약 40 개 이상의 이미지를 자주 생성해야합니다.

Answer 1

나는 그들이 정말로 빠르게 생성한다고 생각하지 않습니다. 텍스트는 정적이며 사용자가 변경할 수 없으므로 모든 이미지를 사전 생성 할 수 있습니다.

텍스트가 동적이어야하는 경우 클라이언트 측 또는 서버 측에서 렌더링 할 수 있습니다.

사용자의 글꼴을 "숨기려면"유일한 방법은 서버 쪽 렌더링입니다. 브라우저가 글꼴을 사용하도록 허용하는 방법은 없지만 사용자가 글꼴을 원하는 곳에 저장할 수는 없습니다. URL을 모호하게 만들었더라도 Chrome Inspector 또는 Firebug를 사용하여 웹 페이지에서 다운로드 한 모든 리소스에 액세스 할 수 있습니다.