Vấn đề hiển thị hình ảnh iOS11

Question

Trên thiết bị iPhone với iOS11 Tôi gặp sự cố khi hiển thị hình ảnh. Những gì tôi đang làm là tải xuống một danh sách hình ảnh khi cuộn nhưng ngẫu nhiên một số hình ảnh không hiển thị. Tôi đã thử gỡ lỗi trên máy tính để bàn Safari và nó cho thấy rằng thẻ img không có src đặt trên nó, nhưng nó vẫn không render cho đến khi tôi làm một số hành động mà sẽ mở ra bất kỳ lớp hoàn toàn bao gồm khu vực.

Những điều tôi đã cố gắng: -

1. transform3d sử dụng GPU rendering. Sử dụng độ mờ, sẽ thay đổi tốt.
2. Thêm một số phong cách để yếu tố thông qua JS để kích hoạt reflow/vẽ lại

Một Doubt: Liệu nó có làm bất cứ điều gì với PPI (Pixel Per Inch). Hiện nay 150PPI của nó. Tôi có cần giảm nó xuống 72PPI không ?.

tôi sẽ đưa vào liên kết nơi vấn đề này thực sự xảy ra nhưng có thể không thực sự xin lỗi

Fiddle Ví dụ:

http://jsfiddle.net/y37eL2hp/4/

Fullscreen: http://fiddle.jshell.net/y37eL2hp/4/show/light/

HTML

<div ng-app="myapp"> 
    <div ng-controller="Mycontroller"> 
    <div class="my-product" ng-repeat="product in products track by $index"> 
     <div class="my-productimgblk"> 
      <ng-lazy-load-img imgsrc="product" class="lazy-smooth-load my-productimg" elem-type="img" elem-width="309" elem-height="400" load-offset-top="860"></ng-lazy-load-img> 
     </div> 
    </div> 
    </div> 
</div> 

Tôi đã kiểm tra ví dụ trên và có cùng vấn đề. Làm rõ bộ nhớ cache khi tải lại

Answer 1

Rõ ràng có một vấn đề đã biết có liên quan đến Safari giả định các ký tự vuông tối nghĩa, và sau khi phông chữ được tải lên lần javascript của bạn inlcuding kịch bản lười biếng của bạn.

Giải pháp workaround là bao gồm một phông chữ dự phòng mà là phổ biến tức là

font-family: "Your strange font", Arial, Sans-Serif; 

hoặc có lẽ sử dụng google-phông chữ

Hy vọng rằng mặc dù hệ thống IOS11 sẽ được vá sớm !!!

Để biết thêm thông tin xem liên kết này: https://bugs.webkit.org/show_bug.cgi?id=174031