Giới thiệu
Những nhà phát triển frontend của số 2013, Privet Drive, tự hào rằng họ đã giữ mã nguồn của mình hoàn toàn bình thường. HTML nằm trong tủ của nó, CSS trong tủ quần áo, JavaScript ở góc — và họ thích như vậy. Nhưng tôi, một người phá vỡ tất cả những quy tắc thiêng liêng của họ.
Tôi là một đứa trẻ nhỏ và gầy hơn so với tuổi, thường mặc đồ cũ của anh họ Angular. Mã của tôi trông lóng ngóng bên cạnh người anh họ lớn hơn và thành công hơn.
Bức thư Đầu Tiên
Một buổi sáng, vào ngày 29 tháng 5 năm 2013, một bức thư đã đến — không phải bằng cú, mà từ một sân khấu tại JSConf US. Nó không được niêm phong bằng sáp, mà bằng sự tò mò. Bên trong: JSX.
Ngày hôm đó, Jordan Walke đã giới thiệu tôi với thế giới; tôi đã mặc bộ đồ đẹp nhất của mình đến hội nghị và các lập trình viên tỏ ra hoài nghi. Một số thậm chí còn có thái độ thù địch. “JSX! Kết hợp HTML và JavaScript? Một sự kinh hoàng,” họ cười nhạo. Hầu hết thế giới vẫn đang cúi đầu trước Chúa tể bóng tối jQuery.
Khám Phá Virtual DOM
Dưới lớp sự vụng về của tôi, tôi có tài năng. Bí quyết của tôi -> luôn vẽ lại toàn bộ cây. Không phải theo nghĩa đen - tôi không phải là một kẻ man rợ.
Đối với nhiều nhà phát triển, DOM giống như một bức tường gạch: chậm và không khoan nhượng. Tôi đã phát hiện ra một lối đi bí mật — một virtual DOM, ẩn hiện ngay trước mắt — nơi mà các cập nhật có thể lén lút đi qua. Tại đó, tôi có thể so sánh các cây và chỉ áp dụng những thay đổi: cùng loại? vá props; loại khác? thay thế node.
Phép Màu Của Khóa
Ban đầu, các phần tử con của tôi bị xáo trộn như những sinh viên năm nhất không tên trên tàu. Nhưng rồi tôi tìm thấy phép màu của một khóa. Cuối cùng, mỗi phần tử con được sắp xếp không theo chỗ ngồi, mà theo danh tính — như một chiếc mũ phân loại đang thì thầm họ thực sự là ai.
Năm 2015: Thay Đổi Lớn
Hai năm đã trôi qua. Năm 2015 là một năm lớn đối với tôi. Tôi bắt đầu tiếp nhận các thành phần chức năng không trạng thái, đơn giản và thanh lịch — những hàm nhỏ nhận props và trả về JSX, không hơn. Tôi không biết rằng mình đang gieo hạt cho tương lai của chính mình, nhưng tôi đang đi trước một bước.
Lúc đó, tôi là v0.14. Một ngày nọ, trong bữa trưa, một đứa trẻ đến và ngồi cạnh tôi. "Này, tôi là JavaScript ES6+,” nó nói một cách tự nhiên. “Cái virtual DOM mà bạn làm? Thật ấn tượng." Ngay lập tức, nó trở thành bạn thân của tôi.
Những Người Bạn Mới
TypeScript cũng nhanh chóng gia nhập vòng tròn bạn bè của tôi. Quy trình RFC là hiệu trưởng cổ xưa: kiên nhẫn và khôn ngoan. Mỗi phép thuật cú pháp hoặc tính năng mới được cân nhắc kỹ lưỡng trước khi được phát hành ra thế giới rộng lớn.
Tôi cũng đã gặp Netflix và cảm thấy một sự chấp nhận mãnh liệt.
Từ Cách Thức Tổ Chức Cũ
Lúc đó, tôi vẫn đang sử dụng phương pháp hòa hợp dựa trên ngăn xếp. Bắt đầu từ gốc, vẽ từng node, lặn sâu vào các phần tử con — cho đến khi xuống tận lá trước khi leo trở lại. Đó là một quá trình đệ quy, đồng bộ và không ngừng nghỉ. Vì tôi chỉ chạy trên một luồng, tôi đã làm đông cứng cả thế giới cho đến khi công việc của mình hoàn tất. Đó không phải là sự thanh thoát; đó là sự kiên trì thô bạo.
Tôi đã nghĩ rằng điều này là đủ. Nhưng khi trưởng thành, tôi bắt đầu thấy những vết nứt: giật lag, khung hình bị rơi, giao diện không phản hồi. Người dùng của tôi cũng nhận thấy điều đó — và điều đó thật đau đớn. Ở đâu đó sâu bên trong, tôi cảm thấy những xao động. Những lời thì thầm đầu tiên về Fiber.
Năm 2017: Thay Đổi Toàn Diện
Cắt đến năm 2017. Tôi đã hoàn toàn viết lại động cơ nội bộ của mình để sử dụng fiber. Mỗi phần tử React có một node fiber tương ứng và không còn được tạo lại mỗi lần render.
Tôi đã học được sự kiên nhẫn. Tôi có thể chia công việc của mình thành các khối, tạm dừng giữa chừng và tiếp tục sau — hoặc thậm chí bỏ qua những nhiệm vụ mà tôi quyết định không đáng để hoàn thành.
Hai Thế Giới
Tôi bắt đầu sống trong hai thế giới cùng một lúc: một cây hiện tại, cái mà bạn thấy trên màn hình, và một cây đang trong quá trình làm việc, nơi tôi lặng lẽ hình thành cập nhật tiếp theo. Lần đầu tiên, tôi có thể ưu tiên nhiệm vụ của mình — các cập nhật khẩn cấp trước, công việc nền sau. Kỷ luật này mở ra cánh cửa cho những tính năng mà tôi chỉ mơ ước trước đây: Concurrent Mode, Suspense, thậm chí các hooks như useDeferredValue.
Lần Đầu Tiên Cảm Nhận Được Thay Đổi
Cuối cùng, tôi đã trưởng thành!
Trước khi tôi biết, đã đến năm 2018. Và đó là khi tôi gặp hooks! Một cái nhìn và tôi biết tôi đã yêu! Đột nhiên, ở mọi nơi tôi nhìn, đều có useState, useEffect, useContext. Chúng không chỉ là các công cụ, chúng là một mô hình tư duy mới.
Hooks Đã Thay Đổi Tôi
Hooks đã biến đổi tôi. Nó cảm giác như mùa xuân cuối cùng đã đến — và đúng vậy, hoa hồng chưa bao giờ có mùi thơm ngọt ngào hơn.
Với hooks, tôi đã tìm thấy bản thân mình!
Thách Thức Mới
Các nhà phát triển yêu quý tôi vẫn còn yêu tôi, nhưng tôi có thể cảm nhận được sự thất vọng ngày càng tăng của họ. Công việc xây dựng giao diện người dùng đã trở thành một bài toán cân bằng: memoize quá nhiều và bạn sẽ làm nghẹt hiệu suất, memoize quá ít và bạn sẽ ngộp trong các lần render lại. useCallback, useMemo, React.memo — những phép thuật này đã làm rối trí họ, lấy đi năng lượng từ niềm vui thực sự của việc tạo ra giao diện.
Đã Đến Lúc Thay Đổi
Tôi biết rằng điều gì đó cần phải thay đổi. Trong nhiều năm, tôi tự hào về khả năng chạy thời gian của mình — Fiber, lập lịch, đồng thời. Nhưng tôi có giới hạn. Tôi đã nuốt pride của mình và gọi thêm sự hỗ trợ.
Người chú tài ba của tôi đã đến — React Compiler. Ông có thể nhìn xuyên qua các thành phần của tôi, phân tích chúng trong thời gian xây dựng và tự động thực hiện các tối ưu hóa. Nơi mà tôi trước đây yêu cầu các nhà phát triển gánh vác gánh nặng hiệu suất, ông hứa hẹn sẽ gánh vác điều đó cho họ.
Suy Nghĩ Về Quá Khứ
Nhìn lại, tôi nhận ra tôi có thể đã vượt qua tình yêu tuổi teen với Hooks. Nhưng tôi chưa bỏ chúng lại phía sau — không hoàn toàn. Hiện tại, chúng vẫn bên cạnh tôi, hình thành cách tôi nghĩ và nói. Và khi tôi tiếp tục phát triển, tôi có thể thấy React Compiler cũng đang tiến hóa thành một điều gì đó sâu sắc hơn — không chỉ là một người chú xa lạ, mà là một người cha, một phần thực sự của gia đình tôi.
Kết Luận
Sớm thôi sẽ đến thời điểm phát hành lớn tiếp theo. "Bạn có viết thư cho tôi trong suốt mùa hè không?" một nhà phát triển hỏi khi họ đẩy commit mới nhất của mình. Tôi mỉm cười. Họ vẫn chưa nhận ra rằng tôi luôn ở đó, luôn tiến hóa. "Tôi sẽ ở gần," tôi hứa. "Dù sao thì, ai đó cũng phải tiếp tục phá vỡ quy tắc tại Privet Drive."
Lần đầu tiên trong đời, tôi thật sự háo hức trở về nhà — bởi vì giờ đây tôi biết mình thuộc về đâu: trong thế giới phát triển frontend, tạo ra những giao diện đẹp cảm thấy mượt mà, sống động và nhanh như chớp.
