[Bug] Doesn't work on php5.6, codeigniter 3

anhvandev commented 2 years ago

Hi I have tested your project on my Codeigniter source code.

Wow it changed the html code structure amazingly. But there was a problem. I think it is caused by your defer.js component. It makes all image and js resources unloadable.

Best regards and good luck!

shinsenter commented 2 years ago

Hi @anhvandev Bạn có thể cho mình thêm thông tin về cách bạn implement thư viện và lỗi gặp phải không?

anhvandev commented 2 years ago

Hi @anhvandev Bạn có thể cho mình thêm thông tin về cách bạn implement thư viện và lỗi gặp phải không?

@shinsenter Để mình setup lại rồi gửi bạn nhé

anhvandev commented 2 years ago

@shinsenter

Bước 1: Đầu tiên mình cài gói bằng composer.
Bước 2:

Sau đó setup hook như thế này:

Nội dung file Defer.php:

Bước 3: chuyển thử một số thẻ img về ban đầu để xem thư viện chuyển đổi

Bước 4: Xem thử kết quả: Ảnh Script: Network All:

shinsenter commented 2 years ago

@anhvandev Cảm ơn bạn vì thông tin, có vẻ như PHP5.6 không phải vấn đề trong setup của bạn.

Ngoài ra thư viện defer.js hình như chưa được load dẫn đến tình trạng này, thực sự trong mô tả của bạn không chụp phần này nên mình cũng khó phán đoán.

Bạn có thể mở cho mình đường link đến website staging và đang bật defer.js để mình inspect thêm không?

anhvandev commented 2 years ago

@anhvandev Cảm ơn bạn vì thông tin, có vẻ như PHP5.6 không phải vấn đề trong setup của bạn.

Ngoài ra thư viện defer.js hình như chưa được load dẫn đến tình trạng này, thực sự trong mô tả của bạn không chụp phần này nên mình cũng khó phán đoán.

Bạn có thể mở cho mình đường link đến website staging và đang bật defer.js để mình inspect thêm không?

Mình đã thấy thư viện defer,js đã được inject vào head. Mình ko public source code lên đc mong bạn thông cảm

shinsenter commented 2 years ago

@anhvandev Cho mình hỏi thêm bạn có đang dùng framework nào render các element cho frontend (như VueJS, ReactJS, Angular v.v..) hay không? Hoặc các thẻ hình của bạn có được khởi tạo bằng javascript (bao gồm cả AJAX, tạo DOM trong quá trình render trang web) hay không? Do thư viện defer.js không tự trigger cho các thẻ được khởi tạo dạng này. Nếu website của bạn tạo động UI bằng JS thì bạn không cần quan tâm tới việc sử dụng các thư viện lazyload nữa.

anhvandev commented 2 years ago

@anhvandev Cho mình hỏi thêm bạn có đang dùng framework nào render các element cho frontend (như VueJS, ReactJS, Angular v.v..) hay không? Hoặc các thẻ hình của bạn có được khởi tạo bằng javascript (bao gồm cả AJAX, tạo DOM trong quá trình render trang web) hay không? Do thư viện defer.js không tự trigger cho các thẻ được khởi tạo dạng này. Nếu website của bạn tạo động UI bằng JS thì bạn không cần quan tâm tới việc sử dụng các thư viện lazyload nữa.

như mình chụp thì là render hoàn toàn bằng php thôi ko dùng js đâu bạn.

shinsenter commented 2 years ago

@anhvandev Một lần nữa, thực sự rất khó để phán đoán nếu ko có đầy đủ thông tin. Mình có thể xin HTML output của website của bạn trước khi apply defer.php hay không?

anhvandev commented 2 years ago

@anhvandev Một lần nữa, thực sự rất khó để phán đoán nếu ko có đầy đủ thông tin. Mình có thể xin HTML output của website của bạn trước khi apply defer.php hay không?

mình gửi bạn nhé before.txt after.txt

shinsenter commented 2 years ago

@anhvandev Mình xem HTML trong after.txt thì thấy <script id="defer-js"></script> đoạn này bị rỗng, bên trong đáng lẽ ra phải embed thư viện defer.js mới đúng.

Trong options của bạn không set cho tùy chọn deferjs_src, mặc định nó sẽ download file từ https://cdn.jsdelivr.net/npm/@shinsenter/defer.js@2.5.0/dist/defer_plus.min.js về và cache lại. Có vẻ lúc đó server của bạn đã không thể download được file này và cache một nội dung rỗng.

Bạn thử giúp mình download defer_plus.min.js từ đường link trên, lưu trên cùng thư mục với file Defer.php của bạn, và trong option của thư viện, giúp mình dẫn để tập tin ở local xem sao nhé!

<?php
// ....
$options = [
    'debug_mode' => false,
    'deferjs_src'  => __DIR__ . '/defer_plus.min.js',
];
$defer  = new \AppSeeds\Defer($options);

anhvandev commented 2 years ago

@anhvandev Mình xem HTML trong after.txt thì thấy <script id="defer-js"></script> đoạn này bị rỗng, bên trong đáng lẽ ra phải embed thư viện defer.js mới đúng.

Trong options của bạn không set cho tùy chọn deferjs_src, mặc định nó sẽ download file từ https://cdn.jsdelivr.net/npm/@shinsenter/defer.js@2.5.0/dist/defer_plus.min.js về và cache lại. Có vẻ lúc đó server của bạn đã không thể download được file này và cache một nội dung rỗng.

Bạn thử giúp mình download defer_plus.min.js từ đường link trên, lưu trên cùng thư mục với file Defer.php của bạn, và trong option của thư viện, giúp mình dẫn để tập tin ở local xem sao nhé!
<?php
// ....
$options = [
    'debug_mode' => false,
    'deferjs_src'  => __DIR__ . '/defer_plus.min.js',
];
$defer  = new \AppSeeds\Defer($options);

ok thank bạn nha

shinsenter / defer.php

[Bug] Doesn't work on php5.6, codeigniter 3 #67