Có một hình phạt hiệu suất bằng cách "ẩn" các đối tượng ngoài màn hình bằng số tiền vô lý?

Question

Một thực tế tôi thường sử dụng khi thao tác nội dung trên trang web là để hoàn toàn vị trí các yếu tố có giá trị trái (hoặc đôi khi trên cùng) khoảng -2000px, để đảm bảo nó sẽ không được nhìn thấy trên màn hình.

Bây giờ, tôi biết tôi có thể sử dụng display: none để làm cho đối tượng của tôi biến mất, nhưng một số yếu tố không chơi đẹp khi không được hiển thị và đôi khi tôi cần tham chiếu đến một số thuộc tính như chiều rộng của nó. Không được truy cập khi thuộc tính display được đặt thành none. Vì vậy, thường tôi sẽ vị trí các yếu tố để nó được ẩn của màn hình.

Giả định của tôi, sau đó, là thế này:

Kể từ khi đối tượng không được trả lại trên màn hình không nên có sự khác biệt trong việc thực hiện các trang web * khi tôi sử dụng left: 2000px như trái ngược với left: 200000000px.

Vì vậy, tôi cho rằng nếu mã sau đây được sử dụng, thì sẽ không có sự khác biệt trong việc thực hiện của hai trang:

trên trang đầu tiên:

<div style="height:100px; width:100px; left:-2000px"></div> 

trang hai:

<div style="height:100px; width:100px; left:-200000000px"></div> 

Giả định của tôi có đúng không? Nếu yếu tố đó là sự khác biệt duy nhất giữa hai trang nhất định, sẽ có bất kỳ sự khác biệt nào (tuy nhiên nhỏ), về hiệu suất?

* Đó là để nói thời gian tải, kích thước trang, đáp ứng, hoặc bất kỳ biện pháp khác thực hiện

======================= ==========

cập nhật

tôi đã cấu hình các trang theo đề nghị của Michael và thấy như sau: Spark đã đúng khi nói rằng thời gian tải sẽ bị ảnh hưởng bởi kích thước tập tin. Có sự khác biệt về bốn byte trong kích thước tệp tương ứng với chênh lệch khoảng 4ms trong thời gian tải.

Thứ hai, giá trị trái lớn vô cùng của tôi đã được IE và Firefox giải thích một cách chính xác, nhưng không phải bởi Chrome. Chrome dường như không nhận ra các giá trị lớn hơn khoảng 135 triệu pixel. Tuy nhiên, do sự khác biệt về hiệu suất dường như là tối thiểu, tôi không thể suy đoán là tại sao họ sẽ quyết định giới hạn nó với số lượng tùy ý như vậy.

Answer 1

Bạn có thể cố gắng lập hồ sơ thời gian tải trang bằng Firebug (hoặc công cụ dành cho nhà phát triển Chrome/Safari), nhưng tôi sẽ vô cùng ngạc nhiên nếu có bất kỳ sự khác biệt nào. Trình duyệt quan tâm đến các x, y, z coords của một phần tử. Nó không quan trọng nếu những người đang ở trên hoặc tắt màn hình; chúng vẫn chỉ là ba điểm dữ liệu rời rạc.

Answer 2

Khi bạn nói hiệu suất, bạn có nghĩa là thời gian tải không?

Thời gian tải của CSS có thể được thực hiện nếu bạn có thể đo sự khác biệt về byte còn lại: -2000px so với trái: -2000000px sau đó có, sẽ mất nhiều thời gian hơn để tải sau, nhưng điều này không liên quan gì đến nó "tắt màn hình" chỉ kích thước CSS.

Vì vậy, câu trả lời dài không đặt màn hình tắt làm cho không có sự khác biệt mà bạn vẫn phải tải nó, tuy nhiên giá trị càng lớn thì thời gian tải càng dài.Tho trong trường hợp này nó quá nhỏ nó không thực sự là một vấn đề.

Đối với lần dụ tải ...

left:-2000px = Input: 0.021KB, Output: 0.019KB 
left:-2000000px = Input: 0.025KB, Output: 0.024KB