本发明提供了一种前端架构系统，其包括视图层、Webpack功能层、控制层和模型层；其中，该视图层、该Webpack功能层、该控制层和该模型层依次通过相应的数据传输链路进行通信；该Webpack功能层与该控制层共同组成一Webpack+Vue框架；该Webpack+VUE框架通过Vue‑router形成动态路由，以此实现关于动态化全局Vue组件的页面加载模式和/或关于iframe嵌套的页面加载模式；可见，该前端架构系统通过动态路由来实现两种不同的页面记载模式，这能够保证当系统中存在大量页面时，每一个页面都能够进行独立的记载处理，从而防止一次性加载过多资源和出现加载首页白屏时间过程的问题，此外，该前端架构系统还能够优化应用系统高并发和安全运行的问题，其能够实现大型应用系统需要的所有功能。