最新 | 最热门 | 最高评价

+0  Chrome开发者工具的小技巧

Tag: Web开发 | 编程工具 | Chrome | CSS | HTML | Javascript
陈皓 发于 2017年01月19日 20:25 | 点击: 1257 | 展开摘要
Chrome的开发者工具是个很强大的东西,相信程序员们都不会陌生,不过有些小功能可能并不为大众所知,所以,写下这篇文章罗列一下可能你所不知道的功能,有的功能可能会比较实用,有的则不一定,也欢迎大家补充交流。

话不多话,我们开始。

代码格式化

有很多css/js的代码都会被 minify 掉,你可以点击代码窗口左下角的那个 { }  标签,chrome会帮你给格式化掉。

强制DOM状态

有些HTML的DOM是有状态的,比如<a> 标签,其会有 active

查看全文: http://www.udpwork.com/item/16066.html

+0  移动H5前端性能优化指南

Tag: html5 | 前端开发
鸟窝 发于 2015年10月30日 10:10 | 点击: 840 | 展开摘要
腾讯出品的前端性能优化指南: 原文,
另外比较知名的很早的一篇前端优化规则是Yahoo出品的,现在依然有效。 Best Practices for Speeding Up Your Web Site, 中文Yahoo前端优化性能规则

以下是腾讯的移动h5前端性能优化指南全文:

概述

PC优化手段在Mobile侧同样适用

在Mobile侧我们提出三秒种渲染完成首屏指标

基于第二点,首屏加载3秒完成或使用Loading

基于联通3G网络平均338KB/s(2.71Mb

查看全文: http://www.udpwork.com/item/14714.html

+0  H5究竟会火到什么地步

Tag: TMT乱弹 | 媒体供稿 | html5 | web app | 商业价值
魏武挥 发于 2015年02月06日 12:29 | 点击: 1257 | 展开摘要
H5忽然火了。
这项于2004年被正式提出的HTML语言的第五次重大修改,过了十年之久,才算在互联网世界中火了起来。在中国,无论是早期腾讯在推其浏览器时,还是后来百度为了打破APP的不可搜索性而力推H5,都没有将之引爆。倒是最近随着微信越来越火,H5也火了起来了。
H5的最大优势就是可以在网页上直接调试和修改,而且更重要的是,它几乎不用考虑用户的机型与适配性问题。智能手机主要被分裂为两大系统:Android和iOS,一个做应用的团队,怎么着也得准备两套班子来适应用户两种手机。

查看全文: http://www.udpwork.com/item/13833.html

+0  HTML6 展望

Tag: Web开发 | 技术读物 | HTML | HTML5 | HTML6 | Web
jnj 发于 2014年12月06日 12:41 | 点击: 7114 | 展开摘要
HTML5 概述

HTML5 是 HTML 语言最受欢迎的版本之一,它支持音频和视频、离线存储、移动端、和标签属性等等。还提供了<article>, <section>, <header>这样的标签来帮助开发者更好地组织页面内容。然而 HTML5 规范仍然没有最后定稿,并且它并不是一个真正意义上的语义标记语言。

HTML6 展望

你有没有曾经希望能在 HTML 中使用自定义标签?比如:使用<logo>来显示你的网站logo

查看全文: http://www.udpwork.com/item/13608.html

+0  在浏览器端用JS创建和下载文件

Tag: JS | Web那些事 | blob | codelet | createobjecturl | html5 | js | 下载 | 下载文件 | 创建文件
iAzrael 发于 2014年01月02日 23:31 | 点击: 1608 | 展开摘要
前端很多项目中,都有文件下载的需求,特别是JS生成文件内容,然后让浏览器执行下载操作(例如在线图片编辑、在线代码编辑、iPresst等)。

但受限于浏览器,很多情况下我们都只能给出个链接,让用户点击打开-》另存为。如下面这个链接:

<a href=”file.js”>file.js</a>

用户点击这个链接的时候,浏览器会打开并显示链接指向的文件内容,显然,这并没有实现我们的需求。

HTML5中给a标签增加了一个down

查看全文: http://www.udpwork.com/item/11461.html

+0  Html5 Audio Ogg

Tag: ogg | x-content-duration | html5
C.C. 发于 2013年08月15日 00:00 | 点击: 866 | 展开摘要
{% include JB/setup %}

問題

Firefox對HTML5 Audio不支持mpeg編碼,一般的做法是選擇Ogg格式。而如果server端要支持Ogg格式的內容,需要注意一個地方:Ogg格式本身是不包含media文件的duration信息的,所以當firefox加載Ogg文件的時候,如果response裏沒有X-Content-Duration,那firefox需要多次訪問文件(當然前提是支持Range Request)來determine這個medi

查看全文: http://www.udpwork.com/item/12895.html

+0  浏览器的渲染原理简介

Tag: Web开发 | 程序设计 | CSS | DOM | HTML | Javascript | Web
陈皓 发于 2013年05月22日 08:17 | 点击: 83697 | 展开摘要
看到这个标题大家一定会想到这篇神文《How Browsers Work》,这篇文章把浏览器的很多细节讲得很细,而且也被翻译成了中文。为什么我还想写一篇呢?因为两个原因,

1)这篇文章太长了,阅读成本太大,不能一口气读完。

2)花了大力气读了这篇文章后可以了解很多,但似乎对工作没什么帮助。

所以,我准备写下这篇文章来解决上述两个问题。希望你能在上班途中,或是坐马桶时就能读完,并能从中学会一些能用在工作上的东西。

浏览器工作大流程

废话少说,先来看个图:

从上面这个图

查看全文: http://www.udpwork.com/item/9900.html

+0  从网页监听Android设备的返回键

Tag: Android | JS | Web那些事 | 快乐的码农 | 未分类 | 移动开发 | android | html5 | 历史记录 | 返回键
iAzrael 发于 2013年02月04日 17:52 | 点击: 1823 | 展开摘要
最近搞Android项目的时候,遇到一个比较蛋疼的需求,需要从Client App调用系统浏览器打开一个页面,进行杂七杂八的一些交互之后,返回到App。如何打开浏览器和如何返回App这里就不说了,有兴趣的童鞋可私下交流。

之所以说这个需求蛋疼,是因为Android有个物理返回键啊……返回键啊……键啊……啊……

用户按下返回键后,预期应该跟点击页面上的返回键一样——返回App。然而这个返回键的被按下的时候网页完全不知道啊(onbeforeunload不算),找不到直接的办法

查看全文: http://www.udpwork.com/item/9593.html

+0  用JavaScript截图

Tag: JavaScript | Canvas | Canvas2Image | html2canvas | 截图
四火 发于 2013年01月08日 23:11 | 点击: 2203 | 展开摘要
文章系本人原创,转载请保持完整性并注明出自《四火的唠叨》

使用JavaScript截图,这里我要推荐两款开源组件:一个是Canvas2Image,它可以将Canvas绘图编程PNG/JPEG/BMP的图像;但是光有它还不够,我们需要给任意DOM(至少是绝大部分)截图,这就需要html2canvas,它可以将DOM对象转换成一个canvas对象。两者的功能结合起来,就可以把页面上的DOM截图成PNG或者JPEG图像了,很酷。

Canvas2Image

它的原理是利用了H

查看全文: http://www.udpwork.com/item/9043.html

+1  扎克伯格的错误

Tag: Review | Facebook | HTML 5
fenng 发于 2012年09月12日 18:49 | 点击: 1421 | 展开摘要
by Fenng@dbanotes.net

今天业界热议的事情是Facebook创始人兼CEO马克·扎克伯格在接受采访的时候承认「专注在 HTML 5上面是他有史以来犯过的最大的错误。」然后,透露出来的数据是:用户浏览的 Feed 信息流是之前的 2 倍。

Facebook 最初使用 HTML 5 的主要原因是什么呢?一次开发,跨平台发布肯定是其中考虑的一个因素,当然,开发上可以做到快速迭代,这和 Facebook 的工程文化也是相符的。不过,这样实际上是节约了开发成本

查看全文: http://www.udpwork.com/item/8104.html

+1  HTML5技术的调研以及贴吧应用总结

Tag: 贴吧技术 | html5 | 前端开发
editor 发于 2012年07月12日 21:15 | 点击: 2109 | 展开摘要
文档简介:

贴吧在进行HTML5技术应用的过程中,进行了一系列的技术调研;本文对HTML5的技术调研进行总结,尽可能客观的分析解答对HTML5技术的一些疑问,给出产品、技术上的一些决策建议。

对于文中的内容以及表述,也热切希望能得到大家进一步的指正和交流。

1. HTML5的发展现状及趋势

1.1 HTML5简介

HTML5是一套技术标准、规范,它定义了一系列的API编程接口和HTML规范(本文中将CSS3也默认涵盖到HTML5的技术范畴);HTML5的运用和推广,

查看全文: http://www.udpwork.com/item/7695.html

+0  33K的FLASH

Tag: 前端开发 | flash | html5
崔凯 发于 2012年06月13日 18:42 | 点击: 1516 | 展开摘要
我们有一个挺重要的页面,每个用户第一次接触我们的产品,都将看到这个页面。

上面挂了一个33K的FLASH,仅33K。

33K,怎么会影响页面打开的速度?

开始时,没怎么考虑这货。

直到演示DEMO的时候,为了一个干净的环境,退掉了所有的东西,重新打开浏览器。

结果明显在这个页面上,停顿了一秒。

本地的33K的FLASH怎么会加载一秒??

截了一下数据,发现后台为了响应这货,启了一个占用20多M内存的 Shockwave Flash 来渲染。

解决方法很简单:换

查看全文: http://www.udpwork.com/item/7480.html
|<<<123456>>>| 一共6页, 62条记录