Membuat halaman statis adalah penggunaan React yang telah diantisipasi, sebagaimana disebutkan dalam dokumentasi untuk React.renderToStaticMarkup
Mirip dengan renderToString
, kecuali ini tidak membuat atribut DOM tambahan seperti data-react-id
, yang Bereaksi menggunakan secara internal. Ini berguna jika Anda ingin menggunakan Bereaksi sebagai generator halaman statis sederhana, karena menghapus atribut tambahan dapat menghemat banyak byte.
Beberapa orang menyebut penggunaan reaksi di sini berlebihan. Namun, ketika saya ingin sesuatu mati, saya tidak punya masalah dengan menimpanya. Fakta bahwa reaksi dapat melakukan jauh lebih banyak daripada yang diperlukan untuk kasus penggunaan ini adalah tidak ada argumen yang menentang reaksi.
Namun, masalah dapat muncul jika Anda ingin melakukan kode asinkron. Mari kita bayangkan yang berikut ini:
function SchoolClass({classId}) {
const students = await query("SELECT name FROM student WHERE class = ?", classId);
return <ul>
{_.map(students, ({name}) => <li>{name}</li>}
</ul>
}
Tetapi ini tidak akan berfungsi, karena fungsi mengembalikan Janji, bukan elemen Bereaksi, dan karenanya tidak kompatibel dengan Bereaksi. Jika Anda merancang kerangka kerja generator situs statis React-style, Anda mungkin akan mengizinkan ini. Namun, karena Bereaksi terfokus pada klien webapp, itu tidak diizinkan.