웹 애플리케이션을 개발하면서 실시간 검색 입력창이나 창 크기 조절(Resize), 스크롤 이벤트를 구현할 때 매 밀리초마다 이벤트가 수십, 수백 번 폭주하는 현상을 경험해봤을 것이다.다만 이벤트가 과도하게 실행되면서 브라우저가 버벅이거나 서버 API 호출 비용이 낭비되고 있음에도 정확한 원인이나 제어 방법을 모르는 경우가 많다.이번에는 자바스크립트의 대표적···
PHP로 파일 업로드 시스템이나 서버 디렉토리 용량 관리 기능을 개발하다 보면, 1048576이나 5368709120과 같은 순수 바이트(Byte) 단위를 1MB, 5GB처럼 사람이 읽기 쉬운 포맷으로 변환해야 하는 상황을 흔히 경험해봤을 것이다.다만 단순 나눗셈 연산이나 어설픈 if 조건문으로 이를 구현할 경우, KB부터 TB, PB까지 유연하게 대응하지···
웹 서비스를 운영하며 게시판이나 프로필 설정에 이미지나 첨부파일을 업로드할 때 "413 Request Entity Too Large" 에러 화면을 경험해본 적이 있을 것이다.다만 대부분의 개발자들은 백엔드 프레임워크나 PHP 코드 문제로 오인하고 애플리케이션 설정만 변경하다가, 웹서버 계층에서 차단되는 원인을 찾지 못해 시간을 허비하곤 한다.이번 글에서는 ···
웹 페이지에서 스크롤에 맞춰 이미지를 늦게 불러오는 지연 로딩(Lazy Loading)이나, 페이지 하단에 도달했을 때 다음 데이터를 자동으로 불러오는 무한 스크롤을 구현해본 적이 있을 것이다.다만 기존의 window.addEventListener('scroll', ...) 방식이 스크롤할 때마다 수십, 수백 번씩 호출되어 브라우저의 렌더링 성능을 심각하게···
관리자 페이지나 화면 모니터링 로그를 개발하다가 사용자의 이메일, 전화번호, 이름 같은 민감한 개인정보가 그대로 화면에 노출되는 상황을 경험해봤을까?관리자 페이지나 시스템 로그 파일에 개인정보를 날것(Raw Data) 그대로 남겨두는 것은 개인정보보호법 및 ISMS 인증 기준 위반일 뿐만 아니라 심각한 데이터 유출 사고로 이어질 수 있다. 다만 매번 화면을···
MySQL을 사용해 트래픽이 많은 웹 서비스를 운영하다 보면 어느 날 갑자기 Deadlock found when trying to get lock; try restarting transaction 에러를 경험해봤을 것이다.다만 이 에러가 어떤 상황에서 왜 발생하는지, 혹은 무조건 쿼리 성능이 떨어져서 발생하는 문제인지 정확한 원인과 해결책을 모르는 경우가 ···
Nginx 웹 서버와 PHP-FPM을 연동해 서비스를 운영하다 보면 어느 날 갑자기 브라우저에 502 Bad Gateway 에러가 발생하는 상황을 한 번쯤 경험해봤을 것이다.다만 서버가 그냥 다운된 것인지, Nginx 설정 문제인지, 아니면 PHP 프로세스 메모리 초과 때문인지 정확한 원인이나 해결책을 모른 채 Nginx나 PHP 서비스만 무작정 재시작하는···
웹 서비스를 오픈하고 열심히 콘텐츠를 발행해도 검색 결과 페이지(SERP)에서 내 글이 다른 사이트처럼 화려한 썸네일, 평점, FAQ 형태로 눈에 띄게 표시되지 않거나 색인 누락을 경험해봤을 것이다.다만 대부분의 백엔드 및 웹 개발자들은 HTML 태그 구성에만 신경 쓸 뿐, 검색 엔진 수집 로봇이 내 데이터를 정확하게 이해하도록 돕는 '구조화 데이터(Str···
PHP 개발을 하다가 갑자기 화면에 "Warning: Cannot modify header information - headers already sent by ..."라는 에러 메시지가 출력되며 페이지 이동이나 세션 처리(session_start)가 실패하는 경험을 해봤을 것이다. 다만 대부분의 개발자들은 이 에러가 발생하는 정확한 원인이나 HTTP 프로토···
쇼핑몰이나 블로그를 운영하면서 파라미터(?sort=desc, ?page=1)나 www 여부에 따라 동일한 페이지가 서로 다른 URL로 접속되는 현상을 경험해봤을까?다만 대부분의 개발자들은 이러한 중복 URL이 검색엔진 크롤러의 평가를 분산시키고 색인 누락을 일으키는 정확한 원인이나 해결책을 모르는 경우가 많다.이번에는 Canonical 태그(대표 URL)가···