4. 看看网页前端技术用在哪里

网页前後端是什麽?

网页前端就是你现在在看的浏览器上面显现的画面，而後端处理资料库存取，与把资料送到前端，而资料传送是用json传送的，json就很像js的物件或阵列，可以轻松被所有语言转换，而前端接收到资料就要渲染页面。

json范例: https://jsonplaceholder.typicode.com/users

xml变成json

以前，前後端的沟通是使用xml，但是他有一个明显的缺点，就是太多tag(标签)了，就长的和html很像
xml:

<user_table>
    <user>
        <id>1</id>
        <name>Alex</name>
        <car>BMW</car>
    </user>
    <user>
        <id>2</id>
        <name>paula</name>
        <car>no_car</car>
    </user>
</user_table>

json:

[
    {
        "id": "1",
        "name": "Alex",
        "car": "BMW"
    },
    {
        "id": "2",
        "name": "Paula",
        "car": "no_car"
    }
]

字数差很多吧！

讲求效率的世代，不准许浪费一分一秒

标题其实不够夸张，就算几毫秒的时间，人类还是读放过。如果有用webpack的人如果使用上线模式进行开发的时候，程序码就会变得完全看不懂。

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).bootstrap=e()}(this,(function(){"use strict";const t="transitionend",e=t=>{let e=t.getAttribute("data-bs-target");if(!e||"#"===e){let i=t.getAttribute("href");if(!i||!i.includes("#")&&!i.startsWith("."))return null;i.includes("#")&&!i.startsWith("#")&&(i=`#${i.split("#")[1]}`),e=i&&"#"!==i?i.trim():null}return e},i=t=>{const i=e(t);return i&&document.querySelector(i)?i:null},n=t=>{const i=e(t);return i?document.querySelector(i):null},s=e=>{e.dispatchEvent(new Event(t))},o=t=>!(!t||"object"!=typeof t)&&(void 0!==t.jquery&&(t=t[0]),void 0!==t.nodeType),r=t=>o(t)?t.jquery?t[0]:t:"string"==typeof t&&t.length>0?document.querySelector(t):null,a=(t,e,i)=>{Object.keys(i).forEach((n=>{const s=i[n],r=e[n],a=r&&o(r)?"element":null==(l=r)?`${l}`:{}.toString.call(l).match(/\s([a-z]+)/i)[1].toLowerCase();var l;if(!new RegExp(s).test(a))throw new TypeError(`${t.toUpperCase()}: Option "${n}" provided type "${a}" but expected type "${s}".`)}))},l=t=>!

如果没做过规模大的专案，你应该会想说干嘛这样做，其实这样做是为了降低空间，把字多的变数变短，和把空白压缩，等等。