WordPress后台为何加载大量JS和CSS文件？

最近发现打开网站后台是相当的慢，我想是插件装多了，看下后台源代码到底加载了多少个 js 和 css 文件呢，你猜多少？80多个，这是通过提取网页源代码中的所有js或css链接排查发现的，其中注意到一个文件“jquery-ui.css”，这后面再说。

一、WordPress后台加载的文件

1、第三方插件12个（js和css数量各半）

/wp-content/plugins/akismet/_inc/akismet.css
/wp-content/plugins/akismet/_inc/akismet.js
/wp-content/plugins/akismet/_inc/akismet-admin.css
/wp-content/plugins/akismet/_inc/akismet-admin.js
/wp-content/plugins/akismet/_inc/fonts/inter.css
/wp-content/plugins/dark-mode-for-wp-dashboard//assets/css/dark-mode-dashboard.css
/wp-content/plugins/litespeed-cache/assets/css/litespeed.css
/wp-content/plugins/litespeed-cache/assets/js/litespeed-cache-admin.js
/wp-content/plugins/wp-dark-mode/assets/css/admin.min.css
/wp-content/plugins/wp-dark-mode/assets/js/dark-mode.min.js
/wp-content/plugins/wp-dark-mode/assets/vendor/chart.bundle.min.js
/wp-content/plugins/wp-dark-mode/assets/vendor/sizzle.min.js

2、第三方主题两个（都是css）

/wp-content/themes/beginlts/inc/options/css/fonts/fonts.css
/wp-content/themes/beginlts/inc/options/css/options.css

3、WP后台自带65个（其中3个是css，另外62个是js）

/wp-includes/js/admin-bar.min.js
/wp-includes/js/api-request.min.js
/wp-includes/js/backbone.min.js
/wp-includes/js/clipboard.min.js
/wp-includes/js/dist/a11y.min.js
/wp-includes/js/dist/date.min.js
/wp-includes/js/dist/deprecated.min.js
/wp-includes/js/dist/dom-ready.min.js
/wp-includes/js/dist/i18n.min.js
/wp-includes/js/dist/url.min.js
/wp-includes/js/dist/vendor/moment.min.js
/wp-includes/js/heartbeat.min.js
/wp-includes/js/hoverintent-js.min.js
/wp-includes/js/imgareaselect/imgareaselect.css
/wp-includes/js/imgareaselect/jquery.imgareaselect.min.js
/wp-includes/js/jquery/jquery.color.min.js
/wp-includes/js/jquery/jquery.query.js
/wp-includes/js/jquery/jquery.ui.touch-punch.js
/wp-includes/js/jquery/ui/autocomplete.min.js
/wp-includes/js/jquery/ui/core.min.js
/wp-includes/js/jquery/ui/datepicker.min.js
/wp-includes/js/jquery/ui/draggable.min.js
/wp-includes/js/jquery/ui/menu.min.js
/wp-includes/js/jquery/ui/mouse.min.js
/wp-includes/js/jquery/ui/slider.min.js
/wp-includes/js/jquery/ui/sortable.min.js
/wp-includes/js/json2.min.js
/wp-includes/js/mce-view.min.js
/wp-includes/js/media-audiovideo.min.js
/wp-includes/js/media-editor.min.js
/wp-includes/js/mediaelement/mediaelement-and-player.min.js
/wp-includes/js/mediaelement/mediaelement-migrate.min.js
/wp-includes/js/mediaelement/mediaelementplayer-legacy.min.css
/wp-includes/js/mediaelement/wp-mediaelement.min.css
/wp-includes/js/mediaelement/wp-mediaelement.min.js
/wp-includes/js/media-models.min.js
/wp-includes/js/media-views.min.js
/wp-includes/js/plupload/wp-plupload.min.js
/wp-includes/js/quicktags.min.js
/wp-includes/js/shortcode.min.js
/wp-includes/js/thickbox/thickbox.js
/wp-includes/js/underscore.min.js
/wp-includes/js/wp-ajax-response.min.js
/wp-includes/js/wp-auth-check.min.js
/wp-includes/js/wp-backbone.min.js
/wp-includes/js/wp-emoji-release.min.js
/wp-includes/js/wplink.min.js
/wp-includes/js/wp-lists.min.js
/wp-includes/js/wp-sanitize.min.js
/wp-includes/js/wp-util.min.js
/wp-admin/js/color-picker.min.js
/wp-admin/js/common.min.js
/wp-admin/js/dashboard.min.js
/wp-admin/js/edit-comments.min.js
/wp-admin/js/image-edit.min.js
/wp-admin/js/iris.min.js
/wp-admin/js/media-upload.min.js
/wp-admin/js/plugin-install.min.js
/wp-admin/js/postbox.min.js
/wp-admin/js/site-health.min.js
/wp-admin/js/svg-painter.js
/wp-admin/js/updates.min.js
/wp-includes/js/thickbox/thickbox.css
/wp-admin/css/colors/modern/colors.min.css
/wp-includes/css/editor.min.css

这只是算 js 和 css 文件，已经加载这么多了，怪不得打开 WordPress 后台很慢。但这些并不是真正原因，而是加载了访问不了的资源，加上这个刚好80个了。

如果是编辑文章页面，那更多，有上百个，恐怖如斯。

二、解决加载 jQuery UI 打开后台很卡慢的问题

这个“jquery-ui.css”文件是来自Google的地址，搜索主题找到以下代码：

// 在适当的地方加载 jQuery UI 日期选择器

function load_datepicker() {
    wp_enqueue_script('jquery-ui-datepicker');
    //wp_enqueue_style('jquery-ui-style', 'https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css');
}
add_action('admin_enqueue_scripts', 'load_datepicker');

这是用于加载 jQuery UI 日期选择器，这还不是 Begin 主题自带的，而是自己加上的，估计是我修复代码时加的，直接注释或删掉似乎也没啥影响。

猜解地址有更新了，目前最新版是 1.13.2 版。找到了其它可以访问的替代源，直接替换这个Google地址也是可以。

微软地址：

https://ajax.aspnetcdn.com/ajax/jquery.ui/1.13.2/themes/smoothness/jquery-ui.css

开源中国地址：

https://cdn.bootcdn.net/ajax/libs/jqueryui/1.13.2/themes/smoothness/jquery-ui.css

官方地址：

https://code.jquery.com/ui/1.13.2/themes/smoothness/jquery-ui.css

微软的国内也是可以访问，不过开源中国的速度更快点。

这个地址改掉后，访问速度明显快多了，基本秒开了。看来以后访问很慢的可以看看有没加载国外的资源，最好用国内镜像替代，避免用国内浏览器访问受影响。