Lập Trình Viên CRUD quèn
Senior Member
Giả sử các thím code Back end Java gì đó khi đọc code từ trên xuống dưới, ví dụ từ dòng 1 tới dòng 10 các thím sẽ hiểu được chính xác logic và flow của code như thế nào. Kiểu làm việc 1 => làm việc 2 => làm việc 3
Nhưng các Framework front end rất hay có trò kiểu như detect change (Khi có 1 cái gì đó thay đổi thì sẽ render / hoặc chạy lại toàn bộ component)
Ví dụ:
Không chỉ vậy việc render lại hay không còn phụ thuộc rất nhiều yếu tố a b c x y z (Ví dụ như dependency array của reactjs sẽ có thể thay đổi hành vi render)
=> Dẫn tới việc các thím mở code lên đọc từ trên xuống dưới của FE sẽ đếch hình dung được chắc chắn 100% luồng code sẽ chạy như nào, khi nào thì luồng nào chạy, và các component con còn nhiều khi ảnh hưởng tới component cha và ngược lại
Tóm gọn lại: Cực kì khó xác định logic flow code + xác định chính xác tất cả các case mà component re-render => Khó debug cực kì
//Ví dụ 2
Để tôi ví dụ cho anh
Giả sử tôi có 1 component như trên có logic 1 2 3 4. Và ở dòng cuối tôi có gọi 1 customer hook tên là 'useFetch' => Nếu trong cái hook 'useFetch' của tôi có gọi hàm setState => Re-render và như thế logic 1 2 3 4 sẽ chạy lại đúng ko???
Nhưng mà code be tôi gặp gần như ko bao giờ có trường hợp đã gọi tới dòng dưới rồi, mà lại có cách thần kì nào mấy dòng trên lại chạy lai từ đầu cả.
Anh công nhận với tôi ko?
Nhưng các Framework front end rất hay có trò kiểu như detect change (Khi có 1 cái gì đó thay đổi thì sẽ render / hoặc chạy lại toàn bộ component)
Ví dụ:
- Khi state của 1 component trong reactjs thay đổi => component sẽ được render (Toàn bộ các đoạn code component sẽ được chạy lại)
- Angular cũng tương tự, 1 props nào đó thay đổi thì component cx render lại
Không chỉ vậy việc render lại hay không còn phụ thuộc rất nhiều yếu tố a b c x y z (Ví dụ như dependency array của reactjs sẽ có thể thay đổi hành vi render)
=> Dẫn tới việc các thím mở code lên đọc từ trên xuống dưới của FE sẽ đếch hình dung được chắc chắn 100% luồng code sẽ chạy như nào, khi nào thì luồng nào chạy, và các component con còn nhiều khi ảnh hưởng tới component cha và ngược lại
Tóm gọn lại: Cực kì khó xác định logic flow code + xác định chính xác tất cả các case mà component re-render => Khó debug cực kì
//Ví dụ 2
Để tôi ví dụ cho anh
JavaScript:
function A(props) {
//logic 1 2 3 4
const { data } = useFetch(url) //Chú ý dòng này
}Giả sử tôi có 1 component như trên có logic 1 2 3 4. Và ở dòng cuối tôi có gọi 1 customer hook tên là 'useFetch' => Nếu trong cái hook 'useFetch' của tôi có gọi hàm setState => Re-render và như thế logic 1 2 3 4 sẽ chạy lại đúng ko???
Nhưng mà code be tôi gặp gần như ko bao giờ có trường hợp đã gọi tới dòng dưới rồi, mà lại có cách thần kì nào mấy dòng trên lại chạy lai từ đầu cả.
Anh công nhận với tôi ko?
Last edited:
chứ tôi có bảo tôi tạo ra đc 1 fw xịn hơn đâu
