+2
Tại sao khi build trang web phía browser luôn convert lại tên của các js css về dạng 1 ký tự ?
Theo mọi người thì tại sao ở những file vendor, code javascript, người ta hay convert hết tên biến và tên hàm về dạng chỉ bao gồm 1 ký tự chứ ko để đầy đủ, tường minh như ban đầu? Kiểu như, khi code, lập trình viên sẽ đặt tên hàm là function calculateSumOfTwoNumbers( ) { }, nhưng khi publish code thì sẽ đặt lại là 1 ký tự gì đó, ví dụ function c( ) { }
function P(e, t, o, i) {
o.updateBound = i, window.addEventListener('resize', o.updateBound, {
passive: !0
});
var r = n(e);
return H(r, 'scroll', o.updateBound, o.scrollParents), o.scrollElement = r, o.eventsEnabled = !0, o
}
function A() {
this.state.eventsEnabled || (this.state = P(this.reference, this.options, this.state, this.scheduleUpdate))
}
3 CÂU TRẢ LỜI
+5
nhưng khi publish code thì sẽ đặt lại là 1 ký tự gì đó, ví dụ
function c( ) { }
Việc khi publish code tên biến bị thay đổi không phải là do người viết code cố tình sửa lại thế, mà là do code đã qua công đoạn minify, bởi một tool npm nào đó, như uglify-js, minifier, babel-minify ... bạn ạ. Lúc đó code sẽ được tối giản hết mức để có được kích thức nhỏ nhất có thể.
Các cách để tối giản code thì như bạn đã nói, có thể là rút ngắn tên biến, tên hàm còn a, b, C ... loại bỏ các dấu xuống dòng, khoảng trắng, index ...
Ngoài ra trong đoạn code của bạn còn có một phương pháp nữa, đó là ở đoạn passive: !0. Mình đoán là khi code mọi người sẽ viết passive: true, nhưng qua công đoạn minify, nó đã trở thành passive: !0, đơn giản vì viết chữ true tốn đến 4 ký tự, còn viết !0 thì chỉ mất 2 ký tự thôi. 
Các công cụ minify nó tính toán chi ly đến thế cơ bạn ạ, nên cũng không có gì khó hiểu khi nó đặt lại tên biến, tên hàm cho ngắn gọn cả
Nhưng theo em được biết Minify chỉ dùng để xóa khoảng trắng và co code về 1 dòng còn việc convert cả name function này thí chưa thấy. Với lại nếu có nhiều function A() giống nhau thì biết code mình đang gọi về hàm nạo ạ ??
Với là chắc người ta thích trở về thời code C 1 is True, 0 is False đó a =))
Nhưng theo em được biết Minify chỉ dùng để xóa khoảng trắng và co code về 1 dòng còn việc convert cả name function này thí chưa thấy
Nó cũng tuỳ vào thư viện mà em dùng, với cả tuỳ vào từng option của các thư viện đó nữa em ạ 
Ví dụ như em có thể vào đây để test package Uglify JS
https://skalman.github.io/UglifyJS-online/
Em click nút option sẽ thấy nó có rất nhiều option khác nhau đấy
Anh test với đoạn code này
function bubbleSort (list) {
var items = list.slice(0), swapped =false,
p, q;
for ( p= 1;p < items.length; ++p) {
for (q=0; q < items.length - p; ++q) {
if (items[q + 1 ] < items[q]) {
swapped =true;
let temp = items[q];
items[q] = items[ q+1]; items[q+1] = temp;
}
}
if (!swapped)
break;
}
return items;
}
thì được
function bubbleSort(e){var r,t,f=e.slice(0),l=!1;for(r=1;r<f.length;++r){for(t=0;t<f.length-r;++t)if(f[t+1]<f[t]){l=!0;let e=f[t];f[t]=f[t+1],f[t+1]=e}if(!l)break}return f}
Còn nếu em thấy có nhiều function có tên giống nhau, thì có nghĩa là chúng đang được đặt ở những scope khác nhau rồi Không có chuyện 2 function ở cùng một scope mà có cùng tên đâu
@thangtd90 ok thank anh ạ =))
+4
Những file đó đã được Minify thành như vậy đó bạn. Mục đích của việc Minify để giảm kích thước của các file js đó đi, giúp client load những file đó nhanh hơn
Lợi ích khác của việc convert như vậy đối với 1 số vendor thì còn để obfuscate code, giấu đi cách implement chức năng (để tránh bị cạnh tranh, chôm ý tưởng chẳng hạn) 
Nhưng theo mình được biết Minify chỉ dùng để xóa khoảng trắng và co code về 1 dòng còn việc convert cả name function này thí chưa thấy. Với lại nếu có nhiều function A() giống nhau thì biết code mình đang gọi về hàm nạo ạ ??
@vigov5 Vậy nếu function có trùng tên sau khi Minify thì sao bạn ??
khi parse toàn bộ source code của lib rồi thì sẽ biết được là có những class, module nào, global variable nào, mỗi class, module có method, có prototype nào. Khi đã liệt kê được ra hết rồi thì cứ đổi tên lần lượt thôi, từ a -> z, thiếu thì từ aa -> az, v..v, sẽ đảm bảo là ko bị trùng, vì dù cho là trùng tên nhưng khác scope thì vẫn khác nhau thôi, ví dụ cùng tên là a nhưng A.a() và B.a() vẫn khác nhau 
@vigov5 Có lý nha
)
Mình cũng thích phong cách này.