All Posts

All Posts

448편
  • 발행일

    오래 떠 있는 화면이 틀리는 두 가지 방식

    인스턴스 관리 화면에서 같은 날 41분 간격으로 두 가지를 고쳤습니다. 하나는 객체 슬롯이 있는 데이터를 저장하면 TypeError가 나면서 저장이 통째로 죽던 것이고, 하나는 다른 화면에서 구성 속성 순서를 바꿔도 이미 열려 있는 탭은 옛 순서로 계속 그리던 것이었어요. 원인은 달랐지만 둘 다 "이 화면이 한 번 정해 둔 것을 계속 믿는다"는 같은 자리에서 나왔습니다.

  • 발행일

    뒤로가기 이력에 쌓을 것과 덮어쓸 것

    상세에서 상세로 두 번 건너가면 목록 버튼이 검색 조건을 통째로 잃었고, 필터를 만질 때마다 뒤로가기 이력이 하나씩 쌓였습니다. 복귀 주소는 받은 것을 그대로 이어달리게 하고, 조건 변경은 덮어쓰고, 화면 안에서 다른 데이터로 건너뛰는 것만 이력에 쌓도록 나눴어요. 기준은 하나입니다. 다른 곳으로 갔나, 같은 화면의 상태가 바뀌었나.

  • 발행일

    로딩 스피너는 장식이 아니라 로드 순서 문제

    관계도와 데이터 맵은 응답을 기다리는 동안 빈 캔버스였습니다. 트리 화면이 쓰던 waitMe를 그대로 가져다 덮으려 했는데, 그 플러그인이 jQuery에 붙어 있다는 사실 하나 때문에 세 가지가 연달아 걸렸어요. jQuery를 한 번 더 실으면 앞의 플러그인이 지워지고, defer로 실으면 그림 자체가 안 그려지고, 켠 스피너를 끌 때는 캔버스가 이미 다른 객체로 바뀌어 있었습니다.

  • 발행일

    2,732건이 만든 92,948px짜리 캔버스

    데이터 맵에서 클래스 타일을 눌렀더니 인스턴스 2,732개를 부채꼴로 세로로 쌓아 캔버스가 92,948px이 됐습니다. 목록으로 보내는 대신 이름 접두어로 묶음 단을 끼웠고, 한 글자씩만 깊어지는 사슬을 같은 단에 미리 펼쳐 최악 경로를 3클릭으로 줄였어요. 같은 날 두 번 방식을 바꿨고, 이튿날 붙인 핵심어 탭은 그날 저녁에 다시 뺐습니다.

  • 발행일

    노드 수천 개짜리 jsTree를 가상 스크롤로

    관리 화면의 jsTree가 클래스 하나에 인스턴스 수천 건을 매달고 있었습니다. 오후에 더 보기 노드를 고치고, 스크롤 자동 적재까지 갔다가, 저녁에 창 하나만 DOM에 두는 가상 스크롤로 확정했어요. 창 밖은 padding으로 높이만 세우는데, 그 여백을 인라인이 아니라 우리가 소유한 style 규칙으로 줘야 했고, jsTree 펼침 애니메이션은 꺼야 했습니다.