github-demo-search-optimization

在项目进行搜索跳转优化时，有几点需要注意下。

SEO优化&非必要筛选条件不展示比如sort=，使用的href属性替代

这样在html文件中是可以直接看到该网址的。

选中无法点击，判断item是否selected

采用FilterLink组件而非a标签以及memo方法可以保证在属性不变的情况下不需要重新渲染：

const FilterLink = memo(({name ,query, lang, sort, order}) =>{
    const doSearch = (config) =>{
        Router.push({
            pathname: '/search',
            query: {
                query,
                lang,
                sort,
                order
            },
        }
        )}
    let queryString = `?query=${query}`
    if(lang) queryString +=`&lang=${lang}`
    if(sort) queryString += `&sort=${sort}&order=${order|| 'desc'}`
    return <Link href={`/search${queryString}`}><a>{name}</a></Link>
})

III. issue详情页优化

在展示仓库列表时，可以通过点击仓库的名字进入查看指定仓库的详细信息，而指定仓库的详细信息的头部基本信息展示是与仓库列表中信息的展示重合的，所以使用LRU Cache将仓库基本信息进行缓存，当浏览器端进入详情页时优先加载LRU Cache中的信息。

IV. 通过使用打包分析工具来优化模块的依赖关系

使用bundle-analyzer进行打包分析，优化moment.js, 将locale下面的语言包仅支持中文