Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor: Lighthouse audits #331

Merged
merged 1 commit into from
Sep 6, 2018
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion .eslintignore
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
build/
dist/
docker/
docs/
node_modules/
reports/
public/
.cache/
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
2 changes: 2 additions & 0 deletions public/robots.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
User-agent: *
Disallow: /
4 changes: 2 additions & 2 deletions server/config.yml
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@
host: 127.0.0.1
port: 8000

favicon: src/assets/favicon.ico
favicon: public/favicon.ico

static:
/assets: src/assets
/: public
/locales: src/locales
development:
/build: build
Expand Down
3 changes: 2 additions & 1 deletion server/local_config.yml.example
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
---

serverUrl: http://127.0.0.1:9100

socketUrl: ws://127.0.0.1:9100/v1/io
apiVersion: v1

20 changes: 12 additions & 8 deletions server/render-page.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,19 +19,22 @@ const readManifest = (file, prefix = '/dist') => {
};

const renderPage = (options = {}) => {
Object.assign(defaultOptions, options);
options = Object.assign({}, defaultOptions, options);

const isProd = !!options.isProd;
const isProd = Boolean(options.isProd);
const bundlePrefix = isProd ? '/dist' : '/build';
let manifest = {};

const manifest = readManifest('build-hash.json');
if (isProd) {
manifest = readManifest('build-hash.json', bundlePrefix);
}

const normalizeCssFilePath = css_file => {
if (css_file.startsWith('http')) {
return css_file;
}
if (css_file.startsWith('/css')) {
return `/assets${css_file}`;
return `/${css_file}`;
}

if (isProd) {
Expand Down Expand Up @@ -71,14 +74,15 @@ const renderPage = (options = {}) => {
};

return `<!doctype html>
<html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="Description" content="OpenPitrix: Application Management Platform on Multi-Cloud Environment">
<title>${options.title}</title>
<link rel="shortcut icon" href="/assets/favicon.ico" />
<link rel="stylesheet" href="/assets/css/normalize.min.css" />
<link rel="stylesheet" href="/assets/fonts/roboto/roboto.css" />
<link rel="shortcut icon" href="/favicon.ico" />
<link rel="stylesheet" href="/css/normalize.min.css" />
<link rel="stylesheet" href="/fonts/roboto/roboto.css" />

${renderCss(isProd && 'bundle.css')}
</head>
Expand Down
6 changes: 3 additions & 3 deletions src/components/Banner/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,9 +25,9 @@ class Banner extends PureComponent {
return (
<div className={classnames('banner', styles.banner)}>
<div className={styles.wrapper}>
<img className="banner-img-1" src="/assets/1-1.svg" alt="" />
<img className="banner-img-2" src="/assets/1-2.svg" alt="" />
<img className="banner-img-3" src="/assets/1-3.svg" alt="" />
<img className="banner-img-1" src="/1-1.svg" alt="" />
<img className="banner-img-2" src="/1-2.svg" alt="" />
<img className="banner-img-3" src="/1-3.svg" alt="" />
<div className={styles.title}>{t('brand.slogan')}</div>
<Input.Search
className={styles.search}
Expand Down
4 changes: 2 additions & 2 deletions src/components/Base/Icon/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,9 @@ import PropTypes from 'prop-types';
import classNames from 'classnames';
import { isNumber, noop } from 'lodash';

import styles from './index.scss';
import svgSprite from 'utils/icons';

import svgSprite from 'assets/icons';
import './index.scss';

const prepend = (el, target) => {
if (target.firstChild) {
Expand Down
8 changes: 0 additions & 8 deletions src/components/Base/Icon/index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -59,12 +59,4 @@
}
}

// styles from alert component
//.icon {
// --icon-status-info: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNLTMtM2gyNHYyNEgtM3oiLz48cGF0aCBmaWxsPSIjMjE5MUNBIiBkPSJNOSAxOEE5IDkgMCAxIDEgOSAwYTkgOSAwIDAgMSAwIDE4ek05IDUuNjgxYTEuMzEyIDEuMzEyIDAgMSAwIDAtMi42MjMgMS4zMTIgMS4zMTIgMCAwIDAgMCAyLjYyM3pNOCA3LjUxNlYxNWgyVjcuNTE2SDh6Ii8+PC9nPjwvc3ZnPg==');
// --icon-status-success: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNLTMtM2gyNHYyNEgtM3oiLz48cGF0aCBmaWxsPSIjMDBBQTcyIiBkPSJNOSAxOEE5IDkgMCAxIDEgOSAwYTkgOSAwIDAgMSAwIDE4em0tMi4xMTUtNi45NEw0LjQ5NCA4LjY3bC0xLjQxNSAxLjQxNCAzLjgwNiAzLjgwNiA3LjU0OC03LjU0OC0xLjQxNC0xLjQxNC02LjEzNCA2LjEzNHoiLz48L2c+PC9zdmc+');
// --icon-status-warning: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIxOCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNLTItM2gyNHYyNEgtMnoiLz48cGF0aCBmaWxsPSIjRjVDNDE0IiBkPSJNMTAgMGwxMCAxNy4zMkgwTDEwIDB6bTAgMTYuMDAxYTEgMSAwIDEgMCAwLTIgMSAxIDAgMCAwIDAgMnpNOSA2bC4yIDdoMS42bC4yLTdIOXoiLz48L2c+PC9zdmc+');
// --icon-status-error: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNLTMtM2gyNHYyNEgtM3oiLz48cGF0aCBmaWxsPSIjQ0EyNjIxIiBkPSJNMTIuNzI4IDBMMTggNS4yNzJ2Ny40NTZMMTIuNzI4IDE4SDUuMjcyTDAgMTIuNzI4VjUuMjcyTDUuMjcyIDBoNy40NTZ6bS0yLjMxNCA5bDMuNDY2LTMuNDY2LTEuNDE0LTEuNDE0TDkgNy41ODYgNS41MzYgNC4xMjIgNC4xMjIgNS41MzYgNy41ODYgOSA0LjEyIDEyLjQ2NmwxLjQxNCAxLjQxNEw5IDEwLjQxNGwzLjQ2NCAzLjQ2NCAxLjQxNC0xLjQxNEwxMC40MTQgOXoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMTAuNDE0IDlsMy40NjQgMy40NjQtMS40MTQgMS40MTRMOSAxMC40MTQgNS41MzQgMTMuODggNC4xMiAxMi40NjYgNy41ODYgOSA0LjEyMiA1LjUzNmwxLjQxNC0xLjQxNEw5IDcuNTg2bDMuNDY2LTMuNDY2IDEuNDE0IDEuNDE0eiIvPjwvZz48L3N2Zz4=');
//}

}
2 changes: 1 addition & 1 deletion src/components/Base/Image/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ export default class Image extends React.Component {
const { failed } = this.state;

if (failed) {
const nonIcon = '/assets/none.svg';
const nonIcon = '/none.svg';
const sizeStyle = {
width: iconSize + 'px',
height: iconSize + 'px'
Expand Down
2 changes: 1 addition & 1 deletion src/components/Card/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ export default class Card extends PureComponent {
render() {
const { icon, name, desc, fold } = this.props;
const iconSize = fold ? 36 : 48;
const noneIcon = '/assets/none.svg';
const noneIcon = '/none.svg';

return (
<div className={classnames(styles.card, { [styles.foldCard]: fold })}>
Expand Down
6 changes: 3 additions & 3 deletions src/components/Footer/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,11 +24,11 @@ export default class Footer extends PureComponent {
<div className={styles.wrapper}>
<div className={styles.inner}>
<span className={styles.logo}>
<img src="/assets/logo_grey.svg" alt="logo" height="100%" />
<img src="/logo_grey.svg" alt="logo" height="100%" />
</span>
<ul className={styles.terms}>
<li>
<a target="_blank" href="https://openpitrix.io">
<a target="_blank" href="https://openpitrix.io" rel="noreferrer">
{t('About')}
</a>
{/* <span className={styles.dot} />
Expand All @@ -45,7 +45,7 @@ export default class Footer extends PureComponent {
>
中文
</a>
<span className={styles.dot}/>
<span className={styles.dot} />
<a
href="#"
onClick={this.changeLocale.bind(null, 'en')}
Expand Down
2 changes: 1 addition & 1 deletion src/components/Header/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@ class Header extends Component {
rootStore: { fixNav }
} = this.props;
const isDark = !isHome || fixNav;
const logoUrl = isDark ? '/assets/logo_light.svg' : '/assets/logo_dark.svg';
const logoUrl = isDark ? '/logo_light.svg' : '/logo_dark.svg';
const needShowSearch = isDark && isHome;
const appSearch = match.params.search;

Expand Down
2 changes: 1 addition & 1 deletion src/components/Nav/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,8 @@ export default class Nav extends PureComponent {

return (
<div className={classnames(styles.nav, className)}>
<p className={styles.caption}>{t('Categories')}</p>
<ul className={styles.subNav}>
<p>{t('Categories')}</p>
{navs.map(nav => (
<li key={nav.category_id}>
<NavLink
Expand Down
17 changes: 10 additions & 7 deletions src/components/Nav/index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,23 @@

.nav {
padding-top: 32px;

.caption {
margin: 0 0 20px;
line-height: 20px;
font-size: $font16;
font-weight: bold;
color: $N500;
}

.subNav {
padding: 0;
margin-top: $base-margin;
//margin-right: -2px;
&:first-of-type {
margin-top: 0;
}
p {
margin: 0 0 20px;
line-height: 20px;
font-size: $font16;
font-weight: bold;
color: $N500;
}

li {
margin: 12px 0;
height: 20px;
Expand Down
2 changes: 1 addition & 1 deletion src/components/Rectangle/AppImages/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ export default class AppImages extends Component {

render() {
const { apps, total, t } = this.props;
const nonIcon = '/assets/none.svg';
const nonIcon = '/none.svg';

return (
<div className={styles.appImages}>
Expand Down
2 changes: 1 addition & 1 deletion src/components/TdName/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ export default class TdName extends React.Component {
renderIcon() {
const { noIcon, image } = this.props;
const isIcon = ['appcenter', 'cluster'].includes(image);
const nonIcon = '/assets/none.svg';
const nonIcon = '/none.svg';

if (noIcon) {
return null;
Expand Down
2 changes: 1 addition & 1 deletion src/pages/AppDetail/Meta/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { get } from 'lodash';
import styles from './index.scss';

const Meta = ({ app }) => {
const iconSrc = '/assets/None48.svg';
const iconSrc = '/none.svg';

return (
<div className={styles.meta}>
Expand Down
2 changes: 1 addition & 1 deletion src/pages/Login/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export default class Login extends Component {
<div className={styles.login}>
<div className={styles.loginContent}>
<div className={styles.loginTitle}>
<Logo url="/assets/logo_light.svg" />
<Logo url="/logo_light.svg" />
</div>
<div className={styles.loginForm}>
<h1>{t('Login OpenPitrix')}</h1>
Expand Down
File renamed without changes.
7 changes: 4 additions & 3 deletions test/pages/__snapshots__/Home.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,12 @@ exports[`Home basic render 1`] = `
<div
class="nav nav"
>
<p
class="caption"
/>
<ul
class="subNav"
>
<p />
</ul>
/>
</div>
<div
class="appList apps"
Expand Down
9 changes: 4 additions & 5 deletions webpack.prod.js
Original file line number Diff line number Diff line change
Expand Up @@ -45,12 +45,12 @@ const clientConfig = {
{
test: /\.(jpg|png|svg)(\?.+)?$/,
use: 'url-loader?limit=100000',
include: [resolve(__dirname, 'src/assets'), resolve(__dirname, 'src/components')]
include: [resolve(__dirname, 'public'), resolve(__dirname, 'src/components')]
},
{
test: /\.(ttf|otf|eot|woff2?)(\?.+)?$/,
use: 'file-loader',
include: [resolve(__dirname, 'src/assets'), resolve(__dirname, 'src/components')]
include: [resolve(__dirname, 'public'), resolve(__dirname, 'src/components')]
},
{
test: /\.scss$/,
Expand Down Expand Up @@ -89,7 +89,6 @@ const clientConfig = {
filename: 'bundle.css',
allChunks: true
}),
// new webpack.NamedModulesPlugin(),
new WriteHashPlugin(),
// new webpack.optimize.OccurrenceOrderPlugin(),
// new webpack.optimize.UglifyJsPlugin({
Expand Down Expand Up @@ -139,15 +138,15 @@ const serverConfig = {
{
test: /\.(jpg|png|svg)(\?.+)?$/,
loader: 'url-loader?limit=100000',
include: [resolve(__dirname, 'src/assets'), resolve(__dirname, 'src/components')],
include: [resolve(__dirname, 'public'), resolve(__dirname, 'src/components')],
options: {
emit: false // don't copy the files
}
},
{
test: /\.(ttf|otf|eot|woff2?)(\?.+)?$/,
loader: 'file-loader',
include: [resolve(__dirname, 'src/assets'), resolve(__dirname, 'src/components')],
include: [resolve(__dirname, 'public'), resolve(__dirname, 'src/components')],
options: {
emit: false
}
Expand Down