码迷,mamicode.com
首页 > 其他好文 > 详细

在线翻译工具

时间:2018-02-02 14:23:24      阅读:164      评论:0      收藏:0      [点我收藏+]

标签:boa   exec   nts   size   重构   兼容   and   就是   技术分享   

咱们开发最经常用到翻译软件了,有道、百度什么的,我都用过,感觉不爽,主要是各种广告,还有奇怪附件程序拖后台(系统洁癖者不能忍受),所以很早之前(大概2016年年底)就做了一个自己的在线翻译小网页,那时是拿人家现成的用,过太久忘记在哪拿来的了。


后来有个想法,想重构这个页面,因为之前是直接拿人家的感觉而且页面调用的资源也很大,看了一下旧版本338KB,新版本才38KB十倍差距啊,所以萌生了重构页面的想法


这个页面遇到最大困难就是复制粘贴功能了,我目标是点击按钮直接把译文粘贴到系统粘贴板上,刚开始用了execCommand这个方法可兼容性不好,我个人也没研究透彻,最后还是用了一个插件(clipboard.js)14KB,整个功能接近大小都是这个插件,其实我个人是很不想用任何插件的,这个项目,我是追求极致,全程用原生写,无奈复制粘贴功能没做好,


重构完在线翻译后,我还研究了基于 Node Electron 开发桌面应用,挺有趣的,我直接把写好的翻译页面利用 Electron 跑起来,这会我开始各种折腾,利用 HBuilder 把我的翻译页面打包成APP,在一开始做翻译页面时候我就有做成响应式的考虑,其实我之前做任何功能或者小页面都会习惯性考虑怎么样布局让UI是响应式的,尽量一套代码PC/M能跑起来


在线旧版链接:http://www.konghaowei.com/WEB/Translation/youdao/

在线新版链接:http://www.konghaowei.com/WEB/Translation/baidu/

 

桌面应用:

技术分享图片

 

 

手机APP:

技术分享图片



在线新版旧版对比:

技术分享图片




 

在线翻译工具

标签:boa   exec   nts   size   重构   兼容   and   就是   技术分享   

原文地址:https://www.cnblogs.com/konghaowei/p/8404518.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!