Tata Letak dan Rendering 60 fps
Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
Mencapai 60 fps dalam project Anda berhubungan langsung dengan interaksi pengguna dan sangat penting untuk kesuksesannya. Dalam pembahasan ini, Nat dan Tom berbicara tentang pipeline rendering Chrome, beberapa penyebab umum penurunan frame dan cara menghindarinya.
Slide
- Sebuah frame memiliki durasi 16 md. Ini berisi JavaScript, penghitungan gaya, pewarnaan, dan pengomposisian.
- Pengecatan sangat mahal. Paint Badan adalah tempat Anda perlu mengulang pekerjaan cat yang mahal secara tidak perlu.
- Lapisan digunakan untuk meng-cache elemen yang digambar.
- Pengendali input (pemroses sentuh dan mouse) dapat menghentikan respons, dan jika memungkinkan, hindari keduanya. Di mana Anda tidak dapat meminimalkannya.
Kecuali dinyatakan lain, konten di halaman ini dilisensikan berdasarkan Lisensi Creative Commons Attribution 4.0, sedangkan contoh kode dilisensikan berdasarkan Lisensi Apache 2.0. Untuk mengetahui informasi selengkapnya, lihat Kebijakan Situs Google Developers. Java adalah merek dagang terdaftar dari Oracle dan/atau afiliasinya.
Terakhir diperbarui pada 2025-07-25 UTC.
[[["Mudah dipahami","easyToUnderstand","thumb-up"],["Memecahkan masalah saya","solvedMyProblem","thumb-up"],["Lainnya","otherUp","thumb-up"]],[["Informasi yang saya butuhkan tidak ada","missingTheInformationINeed","thumb-down"],["Terlalu rumit/langkahnya terlalu banyak","tooComplicatedTooManySteps","thumb-down"],["Sudah usang","outOfDate","thumb-down"],["Masalah terjemahan","translationIssue","thumb-down"],["Masalah kode / contoh","samplesCodeIssue","thumb-down"],["Lainnya","otherDown","thumb-down"]],["Terakhir diperbarui pada 2025-07-25 UTC."],[],["Maintaining 60fps is vital for user engagement. The rendering pipeline involves JavaScript, styling, painting, and compositing within a 16ms frame. Painting is resource-intensive, particularly in \"Paint Storms,\" where it's repeatedly done unnecessarily. Layers cache painted elements to reduce this burden. Input handlers, such as touch and mousewheel listeners, can significantly impact responsiveness; thus, their usage should be minimized.\n"]]
