React Native - Liệu console.log() có ảnh hưởng đến hiệu suất khi đi sản xuất không?

Question

Tôi có rất nhiều console.log() trong ứng dụng của mình. Hầu hết trong số họ đang ở trong khối catch, vì vậy tôi có thể thấy rõ những gì đã đi sai khi phát triển. Một số là có để đăng nhập thời gian hiện tại để tôi có thể kiểm tra thời gian thực hiện chức năng.

Khi triển khai để sản xuất, các console.log() sẽ chạy trong các thiết bị của khách hàng. Tôi có thể để chúng như chúng được không? Họ sẽ làm tổn thương hiệu suất/bộ nhớ hoặc có thể gây ra một số hành vi ngoại lệ hoặc không mong muốn?

Answer 1

Vâng .. vâng. Nhiều mã hơn có nghĩa là thời gian thực hiện lâu hơn. Không chỉ mất CPU "năng lượng" không cần thiết, console.log cũng đồng bộ nên nó sẽ làm cho ứng dụng của bạn chậm hơn (thậm chí là một vài nano giây).

Tuy nhiên, nếu bạn muốn sử dụng gỡ lỗi, bạn nên xem thực sự thành Winston. Nó không đồng bộ nên nó giải quyết được vấn đề nói trên.

Nếu bạn không quan tâm nhiều trong mili giây thì tôi sẽ rời khỏi nó, mặc dù it doesn't take much to let the bundle creator strip code that's going to be production ready. Bạn chỉ có thể làm điều gì đó như sau:

if(__DEV__) { 
    console.log('This will be stripped in production.'); 
} 

Answer 2

Từ Phản ứng docs Quê quán:

console.log báo cáo

Khi chạy một ứng dụng đi kèm, các báo cáo này có thể gây ra một nút cổ chai lớn trong chuỗi JavaScript. Điều này bao gồm các cuộc gọi từ các thư viện gỡ lỗi như redux-logger, vì vậy hãy đảm bảo xóa chúng trước khi gói.

Vì vậy, yeah .. tôi sẽ loại bỏ chúng :)

Những người trong báo cáo đánh bắt của bạn có thể ok để lại trong khi họ chỉ cháy nếu có một vấn đề (thà lấy thông tin thêm về điều đó hơn lo lắng về hiệu suất trúng)

Có nhiều mẹo hiệu suất trên các tài liệu có nguồn gốc phản ứng here

Answer 3

là thực hành tốt này để vô hiệu hóa tất cả các báo cáo console.log trong toàn bộ ứng dụng của bạn?

Bất kỳ tác dụng phụ nào?

Ở phía trên của file: App.js bao gồm:

// To assign console.log to nothing 
if (!__DEV__) { 
    console.log =() => {}; 
}