따라쟁이

John Resig 아저씨가 A Web Developer’s Responsibility 라는 제목이 붙은 장문의 포스팅을 했습니다. 이 글에서는 웹 개발자는 브라우저 버그를 찾고 이를 수정할 수 있게 알려줘야 하는 의무가 있고, 이를 수행하기 위해 항상 버그 리포팅하고 최신 빌드를 이용해 테스트 하라 라고 하고 있습니다. 글의 대부분은 브라우저 (Mozilla/Firefox, WebKit/Safari, Internet Explorer 8, Google Chrome / V8 JavaScript Engine, Opera)에 따라 어떻게 버그 리포팅 해야 하는지에 대해 소개하고 있습니다.

오픈 소스 참여, 버그 리포팅 이런게 생각보다 쉽지 않습니다. 일단 해당 프로젝트에서 사용하는 도구를 익히고 이를 그들의 문화에 맞게 사용하는 방법을 체득해야 하는데… 쉽지 않죠. 이런 점에서 이 글은 자세하게 설명해 주고 있습니다. 브라우저 버그 리포팅하고 싶지만 구체적인 방법을 모르는 분들께는 좋은 글입니다.

저에게는 사실 … 영어가 문제죠 ^^;

ActionScript 3에서 완벽하게는 singleton pattern을 구현할 수 없는데, 그 이유는 private인 생성자를 만들 수 없기 때문입니다. 그래서 몇 가지 팁이 있는데 “Extremely safe singleton classes” 포스트에서는 inline class (접근자가 명시되지 않은 class를 나타내는 듯 합니다. package 내에서는 기본 접근자는 internal이며 이는 동일한 package 내에서만 접근 할 수 있음을 의미합니다)를 이용하는 방법을 사용하고 있습니다.

Singleton class의 생성자에 파라미터가 존재하고 해당 파라미터는 동일한 package 내에 있는 class의 instance입니다. 그런데 해당 class가 internal 접근자를 가지므로 해당 package 외부에서는 instance를 생성할 수 없습니다. 따라서 다른 package에서는 singleton class를 일반적인 방법(new)으로 생성할 수 없고, 반드시 getInstance() method를 사용해야 합니다.

하지만 package 내에서는 new를 이용해 새로운 instance를 생성할 수 있으므로 완벽하지 않습니다. 아직까지 제가 본 바로는 완전한 singleton class를 생성할 수 있는 방법은 없는듯.

Flash Player의 경우 wmode의 설정이 문제를 일으키는 경우가 종종 있습니다. 사실 자세히 따져보면 문제가 아닐수도 있지만, 내가 원하는 동작이 제대로 일어나지 않을 때 이 원인이 전혀 상관 없을거 같은 wmode로 인한 것임을 알게 될때 황당함을 느끼게 되죠. 물론 이런 문제가 대부분의 경우 내가 Flash Player의 동작 방법에 대한 잘 모르기 때문이라고 생각하려고 하지만, Adobe의 행동들을 볼때면 짜증이 나기도 합니다. Flash player 10 릴리즈 할 때 아무런 예고도 없이 beta 버전에서 지원되던 기능을 빼다든지 하는 경우들을 보면 참 그렇죠.

암튼 본 포스트에서의 사례는 activate와 deactive 이벤트와 관련이 있습니다. 해당 이벤트는 flash player가 operating system의 focus를 얻을 때(activate)와 잃어버릴 때(deactivate) 발생합니다. 문제는 이 이벤트가 flash를 embed할 때 wmode=”transparent”로 설정한 경우 발생하지 않는다는 점입니다. 저 같은 경우 다행히도 해결책을 바로 찾았지만(wmode 값 설정 부분을 제거했습니다) 잘못했으면 엄청난 삽질을… 후덜덜..

IE에서 window.open(url)로 열리는 팝업의 경우 GET 요청 헤더에 referer 정보를 포함하지 않습니다. Referer를 체크해서 뭔가를 하는 경우(제가 일하는 곳에서는 주로 방문 집계등과 같은 통계 정보를 추출하기 위해 사용합니다)에 문제가 됩니다.

일반적으로 팝업창을 여는 코드는 다음과 같습니다.

<a href="http://www.daum.net/" onclick="window.open(this.href, 'popup','width=800,height=400').focus();return false;">Open Popup window</a>

위의 코드를 IE에서 실행한 후 Fiddler 등으로 확인해 보면 referer 정보가 없다는 것을 확인할 수 있습니다. 다른 브라우저에서는 referer가 존재합니다(사실 정확히는 모르겠지만 IE에서만 그렇다는…). 그래서 이 코드를 다음과 같시 수정했더니 referer가 포함되네요.

<a href="http://www.daum.net/" target="popup" onclick="window.open('', 'popup','width=800,height=400').focus();">Open Popup window</a>

원리는 onclick 이벤트 시 url을 명시하지 않고 창을 연 다음, 링크의 타겟을 해당 창 이름으로 설정하는 방식입니다. 주의할 점은 onclick 이벤트에서 return false;를 하지 않도록 해서 기본 동작(링크 이동)을 수행한다는 점입니다.

약간 걱정되는 것은 혹시 window.open()의 동작과 페이지 열기가 비동기적으로 동작해서(페이지 열기 후 window.open()이 실행되는?) 팝업창의 속성이 제대로 안먹히면 어쩌나 하는 걱정이. ^^;

네이버에서 제공하는 나눔글꼴을 블로그 기본 글꼴로 변경했습니다. 애플 고딕과 맑은 고딕 모두에 지겨워지고 있던 터라… 네이버 이전에 다음에서도 다음체를 제공하고 있긴 하지만, 일반 텍스트(타이틀이 아닌)에 사용하기에는 너무 두꺼워 눈이 피로해질듯 해 사용하지 않았습니다. 더군다나 나눔글꼴에는 serif(나눔명조)와 sans-serif(나눔고딕)를 모두 포함하고 있어 정말 맘에 드네요. ^^

이번에 글꼴을 변경하면서 맥과 Windows XP가 글꼴을 표현하는데 있어 큰 차이가 있다는 것을 발견했습니다. 아래 그림들은 Windows XP(클리어타입 적용)에서와 맥에서의 동일한 글꼴을 화면 갈무리한 것인데 보시는 바와 같습니다. 특히 명조체의 경우 차이가 너무 심하네요. 한글 글꼴은 명조체가 정말로 이쁜데 말입니다.

글꼴	Windows	Mac
나눔명조
나눔고딕
맑은 고딕