mip-link 组件功能升级说明
背景描述
某个页面被多少页面引用(在其他页面上有指向这个页面的 a 标签),是搜索引擎判断这个页面价值的其中一个因子。这里的搜索引擎不只是指百度,还包括国内外其他的搜索引擎。
MIP 在最初设计 MIP url 跳转逻辑实现时,并未考虑到搜索引擎判断页面价值的这一个点,设计了 mip-link 组件代替了部分 a 标签功能,打断了搜索引擎通过 a 标签去判断页面的价值,导致使用了 mip-link 组件的 MIP 页面的页面价值收到了影响,与此同时,也影响了搜索引擎的搜路和连接关系的判断。
基于上述背景,我们 MIP 项目组需要升级 mip-link 组件以解决上述问题。
实现方案
升级 mip-link 组件,其组件渲染后,mip-link 的内容会用生成的一个 a 标签包裹,此 a 标签放在 mip-link 的节点下,渲染后 DOM 结构如下:
before:
<mip-link href="http://m.baidu.com">链接文字</mip-link>
after:
<mip-link><a href="http://m.baidu.com">链接文字</a></mip-link>
影响
对目前已经使用 mip-link 组件的页面造成的主要影响集中在页面样式上,目前我们会对 padding、margin、display 和 color 做兼容,经过反复测试,目前梳理出来如下定义的 css 可能存在样式问题: nth、 .a > .b > mip-link,所以如果站长发现页面样式有问题,需要对已有样式进行相应调整。现在我们的组件正在测试中,具体上线请大家关注官网动态和 github issues
mip-link 组件功能升级说明的更多相关文章
- 【react-router】从Link组件和a标签的区别说起,react-router如何实现导航并优化DOM性能?
(注:参考自官方英文文档V3.X版本) react-router是伴随着react框架出现的路由系统,它也是公认的一种优秀的路由解决方案.在使用react-router时候,我们常常会使用其自带的路径 ...
- [deviceone开发]-组件功能演示示例
一.简介 这个是官方比较早期对组件功能的展示集合,因为发布的比较早,只包含了部分组件,但是常用的组件和常用的功能都包含了.初学者推荐.二.效果图 三.相关下载 https://github.com/d ...
- 使用HTML5的页面资源预加载(Link prefetch)功能加速你的页面加载速度
不管是浏览器的开发者还是普通web应用的开发者,他们都在做一个共同的努力:让Web浏览有更快的速度感觉.有很多已知的技术都可以让你的网站速度变得更快:使用CSS sprites,使用图片优化工具,使用 ...
- mui 列表项左右滑删除功能升级(仿微信左滑 点击删除后出现确认删除)
mui 列表项左右滑删除功能升级(仿微信左滑 点击删除后出现确认删除) 2018-06-19更新显示样式
- 【Unity】12.3 Off Mesh Link组件
开发环境:Win10.Unity5.3.4.C#.VS2015 创建日期:2016-05-09 一.简介 Off Mesh Link组件用于手动指定路线来生成分离的网格连接.例如,游戏中让行进对象上下 ...
- Hadoop YARN学习之组件功能简述(3)
Hadoop YARN学习之组件功能简述(3) 1. YARN的三大组件功能简述: ResourceManager(RM)是集群的资源的仲裁者, 它有两部分:一个可插拔的调度器和一个Applicati ...
- [开源] FreeSql.AdminLTE 功能升级
前言 FreeSql 发布至今已经有9个月,功能渐渐完善,自身的生态也逐步形成,早在几个月前写过一篇文章<ORM 开发环境之利器:MVC 中间件 FreeSql.AdminLTE>,您可以 ...
- antd源码分析之——标签页(tabs 2.Tabs关键组件功能实现)
由于ant Tabs组件结构较复杂,共分三部分叙述,本文为目录中第二部分(高亮) 目录 一.组件结构 antd代码结构 rc-ant代码结构 1.组件树状结构 2.Context使用说明 3.rc-t ...
- WijmoJS V2019.0 Update2发布:再度增强 React 和 Vue 框架的组件功能
前端开发工具包 WijmoJS 在2019年的第二个主要版本 V2019.0 Update2 已经发布,本次发布涵盖了React 和 Vue 框架下 WijmoJS 前端组件的功能增强,并加入更为易用 ...
随机推荐
- Angular集成UEditor
1.Ueditor的集成主要通过把UEditor做成一个Component来实现,先上Component代码: import { AfterContentInit, Component, Input, ...
- Ocelot中文文档-入门
Ocelot只能用于.NET Core,目前是为netcoreapp2.0构建的,这个文档可能会帮你了解Ocelot是否适合你. .NET Core 2.0 安装NuGet包 使用nuget安装Oce ...
- C/C++静态代码安全检查工具
静态代码安全检查工具是一种能够帮助程序员自动检测出源程序中是否存在安全缺陷的软件.它通过逐行分析程序的源代码,发现软件中潜在的安全漏洞.本文针对 C/C++语言程序设计中容易存在的多种安全问题,分别分 ...
- python库pandas简介
pandas是基于numpy的数据分析模块,提供了大量标准模型和高效操作大型数据集所需要的工具. pandas主要提供了3种数据结构:1.Series,带标签的一维数组:2.DataFrame,带标签 ...
- Maven学习(六)-- Maven与Eclipse整合
由于我使用的是IDEA所以就不摘录了,感兴趣的移步 Maven学习总结(六)--Maven与Eclipse整合 Maven学习总结(七)--eclipse中使用Maven创建Web项目
- eclipse 创建maven web示例
注意,以下所有需要建立在你的eclipse等已经集成配置好了maven了,没有的话需要安装maven. 一.创建项目 1.新建maven项目,如果不在上面,请到other里面去找一下 一直点击下一步, ...
- 如何使用RedisTemplate访问Redis数据结构
RedisTemplate介绍 spring封装了RedisTemplate对象来进行对redis的各种操作,它支持所有的 redis 原生的api. RedisTemplate在spring代码中的 ...
- 二十五、Hadoop学记笔记————Hive复习与深入
Hive主要为了简化MapReduce流程,使非编程人员也能进行数据的梳理,即直接使用sql语句代替MapReduce程序 Hive建表的时候元数据(表明,字段信息等)存于关系型数据库中,数据存于HD ...
- tkinter中布局pack、place和grid(八)
tkinter中布局pack.place和grid pack布局 import tkinter wuya = tkinter.Tk() wuya.title("wuya") wuy ...
- 你不知道的JavaScript--Item11 arguments对象
1.什么是arguments arguments 是是JavaScript里的一个内置对象,它很古怪,也经常被人所忽视,但实际上是很重要的.所有主要的js函数库都利用了arguments对象.所以ag ...