찾다

 >  Q&A  >  본문

javascript - Zhihu에 이미지를 로드하는 원리는 무엇입니까?

처음에는 모두 흐릿하며, 화면 보기 범위 내에 들어오면 고화질로 표시됩니다.

처음에는 전처리된 저화소 이미지를 로딩한 다음 고화질 이미지를 표시하는 건가요?

아니면 다른 방법인가요?

我想大声告诉你我想大声告诉你2773일 전748

모든 응답(4)나는 대답할 것이다

  • 仅有的幸福

    仅有的幸福2017-05-24 11:34:17

    제가 이해한 바는 작은 이미지를 먼저 로드한 다음 CSS3 필터를 사용하여 흐리게 처리한 다음 큰 이미지를 로드한 후 src를 교체하는 것입니다.

    자세한 내용은 이 글을 참고해주세요 http://www.jackpu.com/medium-...

    회신하다
    0
  • 淡淡烟草味

    淡淡烟草味2017-05-24 11:34:17

    필터: 흐림(10px), 로딩 완료 필터: 흐림(0)

    회신하다
    0
  • 曾经蜡笔没有小新

    曾经蜡笔没有小新2017-05-24 11:34:17

    Zhihu는 캔버스를 사용하여 Medium과 같은 작은 이미지를 흐리게 하고 로드 후 큰 이미지를 제거합니다. 퍼지 알고리즘을 제어할 수 있다는 장점이 있지만 상대적으로 무겁다는 단점이 있다.

    전환을 위해 작은 이미지를 흐리게 하는 브라우저의 기본 방법을 사용했습니다(https://blog.crimx.com/2016/1...). 장점은 상대적으로 가볍고 호환성이 좋다는 점이지만, 작은 이미지는 미리 흐리게 해야 더 좋은 결과를 얻을 수 있습니다. 호환성에 관계없이 CSS 흐림을 사용할 수 있습니다.

    회신하다
    0
  • 为情所困

    为情所困2017-05-24 11:34:17

    원리는 위에서 언급한 것과 거의 동일합니다. 여기서는 제가 직접 사용할 수 있는 vue 구성 요소도 만들었습니다
    vue-img-loader

    회신하다
    0
  • 취소회신하다