这篇文章 “Shadow DOM” 由 Steven Wittens 撰写,它只是模糊地提到了 Shadow DOM。 它主要讲述了所有事物有多糟糕。 HTML 很糟糕,CSS 很糟糕,DOM 很糟糕,SVG 很糟糕,MathML 很糟糕…… 我不想针对 Steven。毫无疑问,他比我聪明许多(许多)倍,并且有充分的理由。 让我们放眼更广阔的世界。
我经常从那些在这个领域工作了很长时间并且非常聪明的人那里看到这种现象。 他们对我们必须使用的系统产生了厌恶。 他们看到了所有的缺点、错误,尤其是他们认为的深层系统性缺陷或历史错误。 随着我们不断前进,在这些被认为是基础的裂缝上继续构建,所有这些都变得更糟。
他们总是提出非常有见地的观点。 我们只能点头称是,因为他们是对的,网络确实做了一些怪异的事情,并在许多方面让我们失望了。 如果我们能把一切都抛开,用一些新的、完美设计的系统来满足每个人的现代需求,那不是很好吗? 当然,当然很好。 你想住在你的城镇还是乌托邦式的村庄? 我选择乌托邦。
一句必须补充的话:但乌托邦并不存在!
网络上没有其他的布局语言。 没有其他方法可以提供可访问的内容。 没有更好的替代方案争夺领先地位。 这是因为这是一项艰巨的任务。 任何竞争者都需要
- 开发一个新的系统,该系统在所有方面都优于现有系统。
- 让全球的开发者都同意这个新系统更好,并要求使用它。
- 让标准机构(或类似机构)支持它,以便有监督和独立的实施信息来源。
- 让所有浏览器都同意并完美地实现它。
哈哈,没错。
所有这些事情都难以置信地困难,难怪很少有人尝试。 我认为 #1 是最难的。 我们目前的系统存在很多缺陷,但想象一下从头开始构建这样一个复杂的系统。
我觉得现在网络技术正在发生的事情是,这些问题正在以更小的规模得到解决。
当然,HTML 是我们的内容,但它也负责语义,对吧? 如果我们可以在其中做任何我们想做的事情,而不必担心是否会损害语义,那会很棒。 希望 Shadow DOM 可以帮助解决这个问题。 也许它还可以帮助解决 CSS 在你不希望它成为全局性的时过于全局的问题。
也许 flexbox、网格布局 和 区域 可以成为我们一直需要的真正强大且直观的布局系统,而没有表格固有的可访问性问题。
SVG 并不完美,但也许它仍然比使用光栅图像格式来显示矢量图像更好? 也许 SVG 有可能帮助网站更好地使用 图标系统? 也许我们可以开始使用 一种新的图像格式,它越来越多地适用于现代浏览器。
也许预处理器可以成为一种解决方案,以简化这些复杂语言的编写并降低复杂性?
也许我们可以 扩展现在的网络,就像我们希望看到的那样,使用现有技术。
这些事情证明了我们可以让网络变得更好。 我们可以慢慢地做到。 我们可以借助标准机构的力量做到。 我们可以教育开发者,随着时间的推移改变他们的思维方式。 我们可以使用已经存在的浏览器,所以我们不需要对抗公众行为。
我认为听起来不错。 我也不认为我们有太多选择。
如果有人认为他们可以做得更好,那么他们对现实世界中的工作一无所知……就像人们不喜欢 jQuery 或其他框架一样……没错,如果你想要一些完全符合你自己需求的东西,那么就从头开始做吧,但你会最终陷入和其他人一样的烂摊子,因为相同的原因和相同的逻辑……逻辑就是逻辑。世界就是这样的,考虑到其中有那么多愚蠢的混蛋。 我们应该感谢互联网的存在。
我认为只有“愚蠢的混蛋”才会相信所有的 JS 最终都会变成 jQuery。 说 Wittens “对现实世界中的工作一无所知”需要一个非常“愚蠢的混蛋”,或者说我们行业不可能进步,因为你认为没有人能做得比你好。
好吧,如果没有当前网络技术的缺点,我们现在就会失业了。
我希望我每天都能骑着我的沙发去上班,当我从沙发上下来踩进泥坑时,它会是巧克力牛奶。 我会去上班,按下按钮,然后转身回到我的豪宅,在装满健力士黑啤酒的游泳池里泡个澡。 没错,生活远非完美……
说得好;)
我从事这个行业已经很长时间了(我不确定我是否非常聪明)。
对我来说,网络及其实现方式一直都显得非常复杂。 对于一个完美主义者来说,这可不是什么好事。 但是,我必须承认,随着年龄的增长,我发现自己越来越倾向于“如果它能完成工作并且看起来还可以,那就足够了”。 这是 12 年前的我不会做的事情。
但正如 Ivan de la Jara 在上面所说,你可以重新发明轮子,最终还是会得到同样的烂摊子。 有时我会嫉妒我的同事,他们在编程(真正的编程,而不是 PHP)和图形设计(印刷媒介)方面工作,他们可以在技术上完美地完成工作,而不用跳过无数的障碍,也不用做出无数的妥协,因为我们必须支持浏览器 X,或者没有比框架 Y 更好的选择。
这也总结了我的感受。 当然,当网站完工时,你会感到自豪,因为你克服了一些障碍,尽管这是一个漫长的过程,而且很难让其他人注意到为此付出的努力。
我也经常这样想,“以及图形设计(印刷媒介)方面工作,他们可以在技术上完美地完成工作,而不用跳过无数的障碍,也不用做出无数的妥协”。 能够达到一个你可以感觉到自己在某个特定行业精益求精的地步,一定很不错。 我并不是说网络设计/开发领域没有专家,而是网络包含了太多不同的技能,所以很少有人能感觉到自己精通所有技能。
我想大多数人试图达成的目标或标准就像你说的那样,“如果它能完成工作并且看起来还可以,那就足够了”。 然而,梦想着能够将我们的精力集中在创建更具吸引力的网站,而不是努力使它们与所有浏览器、设备、操作系统和屏幕尺寸兼容,这的确是一件美事。
这些聪明人(仍然)没有被听到(W3C、WhatWG 等),这一事实证明了你在结论中提到的新的标准机构不会带来你/聪明人/我们所渴望的改变。
我几乎每天都会对使用的所有技术挑毛病。 有时我甚至怀念以前作为程序员(编译语言)的工作。 但我很快就会继续我的工作,因为我喜欢它并且热爱它。
我们总是需要(内部)库和(内部)框架来解决技术问题,并加快设计和开发速度。
我最大的抱怨始终是浏览器供应商对标准的实施速度太慢。 最终,他们每个人都有自己对标准的诠释。(你的第 4 点)
因此,即使我们有了不同的系统、新的标准和新的标准机构,我们可能也需要等待数年才能实现它们(以不同的诠释形式;这就像小便标记领地。 没有人会改变这种本性。)
嗨 Chris,(为了标记而编辑)
看到这种习得性无助仍然存在,让人感到失望。 你告诉我十年前我们在哪里,现在我们在哪里,以及十年后我们将在哪里。
浏览器制造商花费了大量时间却一无所获,因为这项工作毫无意义。 他们正在实现没有人想要的模型,而这个模型是由不了解如何使用它的人指定的。 如果你仔细阅读 CSS 规范——没有人会阅读——或者看看浏览器内部,这就是事情的运作方式。 布局模型,作为约束解决,隐藏在样式之间。 这样的系统无法简化,只能变得更加复杂。 相反,我们可以把它装进一个盒子里,并在它周围构建新的东西。
你很聪明。 再看看我的文章。 注意它的布局:文字和方框。 注意贯穿所有段落的极其一致的基线网格。 现在看看源代码,你会看到什么?
你看到的 100% 语义内容被分成块,并包裹在一个完全无语义的布局系统中,该系统伪装成 CSS 类。我已经用这种方式编写 HTML/CSS。我已经在源代码中编写 LaTeX 并使用 MathJax 将其转换为跨度。我已经在其中嵌入了带有完全自定义 SVG 模型的 iframe。我的读者和 Google 都不介意。我不是在做梦,而是在试图唤醒你。
Iframe 正好是我在文章中描述的那样:一个嵌入式视图,具有自己的控制器和隔离的树模型。错误不在于创建 iframe,而在于强迫它们只包含 HTML。
Shadow DOM 并不在内部,而是在外部,围绕着我们丢失的
<body>。浏览器已经实现了它,你只需要将它从排版人员告诉我们的“设计”方法中分离出来。“这就是为什么绝对定位对于移动设备来说是性能优势:它避免了在很少改变的事物之间创建不可见的动态约束。”
他显然从未做过响应式网站。
我完全同意 Stephen Wittens 的观点。也许如果足够多的受人尊敬的聪明人像斯蒂芬那样写批判性文章,改变才有可能发生。我知道如果我提到微软的 xaml 堆栈是一个设计良好的声明式 UI 标记语言,人们会呻吟。但它是可扩展的,并且由对象模型支持,并且具有与 shadow dom 类似的功能。视觉树与渲染树、数据绑定模板等等,所有这些元素都形成了一个连贯的对象模型。你认为 CSS 网格是从哪里来的?如果你闭上眼睛,它几乎与新的 CSS 规范完全相同。好处是它可以在跨平台渲染一致。尽管 Rob Eisenberg 指出它并非没有缺陷。但是,我们似乎正在使用 Web 堆栈越来越近,而 CSS 是最大的问题。
史蒂文谈到了Facebook React,我从未使用过,但从我在他们页面上看到的内容来看,也许是因为太晚了,而且我非常困倦,我无法想象离开简单的标记和 CSS 去使用它(因为它看起来很复杂)。这些新的 Web 技术很好,但它们不需要覆盖现有的技术,因为它们仍然让我们的生活变得更加轻松。
讨厌讨厌的人也很讨厌。
我认为预处理器在这里是一个很好的交叉点。浏览器可以开发成直接读取 Haml 或 Sass 吗?然后,随着时间的推移,我们可以逐步淘汰 HTML 和 CSS。
不幸的是,我的技术水平不够,无法理解这是否是一个好主意。
我相信我会找到使用这些新技术的方法,这些方法会让他们感到过于局限。
好吧,世界不是一个完美的地方。现在……我们当时在哪里?
大多数所谓的“聪明人”都有不切实际的期望,并且对事物的平庸状态并不满意。谈到经验,我的智商是 145,我从未将其视为很大的优势,因为我过去也过于复杂化事物。不值得。
正如上面的人提到的:从多年的实际生产中,我也学到了一点,当你使用一些能够完成工作的东西时 = 看起来不错,工作正常 = 不会崩溃。完成了。继续前进。下一个工作正在等待。
史蒂文说得很好,但有点天真。
Web 和技术永远不会完美,我喜欢这样。对我们尝试做的事情缺乏支持,或者 UI 设计师制作的东西超出了标准的范围,这推动了创造力和创新,以利用我们现有的工具来创造一些能够让世界感到惊叹的东西,并让其他开发人员问他们是怎么做到的?如果开发世界是完美的,那将是一件很棒的事情,但我可以看到事情变得陈旧、无聊和重复。
Chris,写得很好。这种思维方式似乎在 Web/软件开发中的许多“聪明人”中都很普遍。通常,它归结为,“它不完美,让我们把它炸掉,从头开始”。更常见的是,这不是最好的行动方案。
这与“聪明人”和“看起来不错”无关。它指的是一个深入 DOM 深处的程序员,并梦想着一个更好的地方。它指的是人们没有理解这一点,并谈论他们现在是如何工作的(就像史蒂芬)。它指的是尊重那些梦想的人,因为他们推动了 Web 发展。我们其他人只是“做完我们的工作”。
我认为这是一种很好的看待这篇文章的方式。我不认为史蒂芬寻求更好/更语义化的网站开发方式的目的是“过于乐观”或“天真”。他正在解构 Web 的现状,并指出改进的领域,同时试图指出我们今天在设计/开发方面存在缺陷。
问题是人们将此视为弱点:“看看这个对 Web 感到不满的人,忍住,继续前进,这些问题有解决方案,Web 正在发展/改进。它也永远不会完美,所以别抱怨”。
我认为史蒂芬提出了许多很好的观点(正如其他人所承认的那样),重要的是回顾 HTML/CSS 的历史,并了解这些语言的预期用途及其与当今的定位相比。这在 Web 向前发展以及我们不断引入新的开发方法(使用预处理器等)时尤其重要。
我同意并尊重 Chris 对此的看法。Chris 不关注 Web 的缺点,而是寻求找到解决方案,而不是沉溺于可能出现的问题。我认为这是 Chris 的看家本领,他适应 Web 并不断前进,并且因此变得更强大。这是一种很好的态度,但它也并不否定史蒂芬所说的,他指出了某些语言如何“让我们失望”,并且随着时间的推移变得越来越复杂和混乱,而且通常是不必要的。
另一个问题是人们看到史蒂芬的文章并说:“那么,你对这些问题的解决方案是什么?”。嗯,这篇文章指出了他认为 Web 的当前缺陷,甚至提到了他采取的解决其中一些问题的方法(使用 Angular 等)。无论如何,他的文章很好地描述了当今 Web 的状态,对我来说,这已经足以让我发现他所写内容的价值,并欣赏他所提出的见解。
不应该让他承担解决 Web 问题的责任,也不应该因为他在没有立即解决方案的情况下批评 Web 而对他进行指责。他正在开启一场对话,并提出了一些有效的观点,我们应该就此止步,不要将我们自己的判断强加于他的写作动机。
阅读、思考、重复。尽你所能改变你所能改变的事情。这不是关于 Web 技术是好是坏,而是关于你个人能做些什么。尊重两位作者,并向他们致敬。
我是一个设计师,而不是程序员,但同意 Stephen Wittens 的观点。这甚至不是关于聪明才智,而是关于心态和拥有愿景、想象力……不满足于现状……否则,爱因斯坦怎么会提出相对论?或者有人记得史蒂夫·乔布斯的现实扭曲力场……如果我们遵循“在现实世界中工作”的相同逻辑,亨利·福特就会发明一种更快的马!
“想象力比知识更重要。”
——阿尔伯特·爱因斯坦
史蒂文。习得性无助?所以,你的意思是说 Chris 只是接受了我们对现有的“工具”的弊端无能为力?我们中太多的人只是接受了这些烂东西,然后继续前进?不,我完全不同意。我认为大多数开发人员,尤其是 Chris 和那些关注 Chris 和他的网站的人,坚信持续改进。这是我们个人和职业发展唯一途径。
任何认为这是错误的人,为什么要阅读这篇文章?你为什么会在 CSS-tricks.com 上?为了改进,为了学习,我希望也是为了成长。如果习得性无助真的如此普遍,没有人会费心阅读 Chris 的网站,或者史蒂芬的网站(即使我简化了你所谈论的更广泛的概念)。
我们都努力创造最好的网站、应用程序或产品,如果我们找到了更好的方法,无论是软件、语言还是任何工具,我们都会使用它并做到这一点。
但我们并非所有人都能重写我们所使用的整个系统/工具/语言。也许我们并非所有人都想这样做。但这并不意味着他们反对它,或者不欢迎它。
对我来说,这是关于理解和欣赏你所拥有的东西,它能让你做什么,以及如何最好地使用它,尽管存在缺点。这不是习得性无助,也不是幸福的无知,或者你想强加于它的任何负面的、贬低性的标签。我的意思是,我们难道不能用我认为的“poly-fills”和旧技术的改进来构建令人难以置信的网站吗?你见过人们在 codepen 上制作的一些东西吗?
我的意思是,我们正在谈论的事情是一项巨大的、艰巨的任务。世界上大多数开发人员可能都会同意,并希望有更好的方法来做事。
但史蒂文,说你在试图叫醒克里斯,这听起来很荒谬。我的意思是,你试图从什么地方叫醒他?一个虚假现实,在那里 html 是神,dom 统治一切?克里斯是祭司长?我不这么认为。
我的意思是,在你的文章中,你谈论的是“重新发明轮子”,因为没有更好的描述。但它也可以总结为“为什么轮子很烂,为什么我讨厌它”。你在批评某人说,“你知道吗,轮子现在很好用。我相信它会随着时间的推移而改进,最终会被取代,但我现在不会抱怨它,也不会假装我拥有替代方案的最终答案”。
你提出了一些关于 html、css、dom 等的不足和问题的非常有效的观点。它只是看起来过于消极和悲观。你对克里斯帖子的回复中的评论,看起来很小气。
归根结底,这些只是观点,而不是事实。克里斯发布了他的观点。它与你的不同。接受它。
我认为格雷格在他的回复中也提出了一些很好的观点。但我真的很喜欢克里斯非常外交地指出了另一种观点的方式。
“我们看待问题的方式就是问题。”
我同意你的观点,克里斯。我更愿意拥有像网络这样不完美但普遍可访问的系统,而不是完美但专有的替代方案。
你说的没错:改变必须一点一点地进行,一块一块地进行,建立在之前的基础上:演化,而不是革命(就像 HTML5 的设计原则之一所说)。
有一个试图从头开始清除一切的历史先例。那就是 XHTML2。我们都知道那变成了什么样子。
关于向后兼容性这块沉重的包袱,我需要说的大部分内容都已经以各种形式在这里说过了,我不会重复。关于最近实现真正进步的可能性,我想补充两点
1) 我发现,为了让
<picture>加入到 Blink 中,Yoav Weiss 必须进行 IndieGogo 募捐,这实在是讽刺。非常爱它,但这真的应该从我的工资里扣吗?谷歌,一家市值 4000 亿美元的公司,竟然找不到工程资金来实现一个推动开放网络(它通过广告获得资金来源)发展的功能?经过两年的激烈讨论,以及无数数据显示了大图片在小设备上的性能问题(以及由此导致的参与度下降),你可能会认为,这个最有可能从这个功能中获利的大脑信托,可以自己做出这个举动。我只能推测,在谷歌大厦的中层管理人员那里,有一些东西丢失了,因为顶端的策略人员和底层的普通开发人员似乎都理解了紧迫性。2) 像 GSS 这样的改变游戏规则的布局系统,通常不会立即引起很多关注,因为它们 a) 不是立即可用的 b) 起初难以理解。GSS 的理念和算法已经存在了 15 年。Prollyfill 已经开始运行。什么才能说服 W3C 将 CSS 超越愚蠢的有限父/子关系的限制?我们是否需要另一个 IndieGogo 超级英雄来让 GSS 在 Blink 中实现?
总的来说,我对围绕 ES7 功能的炒作感到厌倦,这些功能我可能永远不会使用。我不需要在浏览器中玩 Quake。我希望看到更多关注 CSS 和 DOM 中真正向后兼容、难以修复的部分。上面提到的两个功能将是一个良好的开端。
直接取消或抵制 IE,让它屈服……这一个修复措施将会推动事物向前发展,因为 IE 是微软的,而微软的一切都很烂
实际上,微软已经走得很远了。几年前,在 IE9、IE10 和 IE11 发布以及 Visual Studio 2013 中出现令人愉快的界面之后,我会完全同意你的观点,我认为微软正在真正提升他们的游戏水平。我运行着 Apple Mavericks 和 Windows 7。它们都有自己的怪癖。
我宁愿务实,而不是太聪明,以至于只看到 HTML、CSS 和 DOM 等东西的缺陷。这些东西不容易改变。接受它们。如果你不喜欢 DOM 之类的东西,那就像约翰·雷西格一样。
好吧,先暂时忘掉这篇文章。你们有没有玩过史蒂夫·维滕斯的网站?特别是那个疯狂的标题。你必须滑动并拖动它。观察前景和背景元素以惊人的平滑速度相互旋转。点击播放按钮,开始音乐过山车。
然后打开你的开发者工具,在你围绕主窗格平移时观察代码。太酷了。
他的整个网站都充满了很棒的设计细节。即使当你滚动主文章时,视差背景元素也很棒。文章的布局和艺术指导也非常适合内容。
与此同时,我花了一整天的时间为另一组社交媒体图标创建 SVG 精灵,这些图标我可能无法重复使用。至少我不必再使用自定义网络字体了。
说真的,我已经做了 14 年了,令我惊讶的是,仅仅为了让几个该死的社交媒体图标正常工作,就需要花费如此多时间和精力。
“说真的,我已经做了 14 年了,令我惊讶的是,仅仅为了让几个该死的社交媒体图标正常工作,就需要花费如此多时间和精力。”
这基本上就是我上面说的。虽然我相信从事传统编程或印刷媒介设计工作的人在深夜也花费了无数时间解决问题,但我敢打赌,这些问题与将两个框垂直对齐或弄清楚如何改进文本下方下划线等琐碎的事情无关。虽然这些东西很有趣,但从商业角度来看,这是一场噩梦。
不过,这有点多余。虽然我同意网络标准在规范和实现方面很差(这是维滕斯抱怨的核心内容),但他并没有用这种观点开创新的领域。
当“聪明人”在他们的虚荣网站上引用物理学家时,这很吓人,但看看他的推特——你不希望像他这样的人负责网络标准:-)
在这个评论线程中,人们对史蒂文表现出的负面情绪让我感到羞愧。我为成为这个“社区”的一员而感到羞愧。
什么负面情绪?
一半的帖子似乎同意他的观点,另一半(比如我)指出,他并没有说一些新东西,他自己的抱怨并没有提供一个明确的前进道路。他自己的虚荣网站和帖子证明了产品/网页设计中的其他问题(过度工程、架构航天等)。
是他先开始的!别那么娇气:-)
杰赞·托马斯
史蒂文自己的文章是基于对当前网络技术的负面情绪。这没什么错。他在很多事情上都是正确的。
正如我之前评论的那样,我几乎每天都在抱怨一些我不得不使用的网络技术。(如果这是一个新的、尚未解决的问题。)
但我也很现实,我知道我没有任何影响力来做出改变。
我要告诉你一个公开的秘密。史蒂夫·维滕斯也没有影响力。
史蒂文称之为“习得性无助”,参见他上面的评论。
我称之为接受我被赋予的东西,并在项目截止日期之前尽力做到最好。
我和我的客户尤其不关心我是如何做到的。
此外,一旦你用解决方法解决了某个问题,我敢肯定你不会在下一个项目中从头开始解决同一个问题。;)
你甚至可能会从框架 X 中提取解决方法,并给予充分的认可,因为它为你节省了从几个小时到几天不等的工作时间。
因此,这个问题被否定/抵消/战胜/压制了。它已经成为一个无关紧要的问题。那么为什么还要继续谈论它呢?
满意的客户让我能够支付公司和个人账单,并有大量的剩余资金。这对我的重要性更大。
时间在流逝,我不会一直都在。
standard-div
在 60 年代/70 年代,许多娇弱的花朵等于“花之力”。:)
罗伯特,你称之为“现实”;我称之为“天真”。
杰赞,现实且没有对做出结构性改变的幻想,这将是一个更好的描述。
天真是我对通过 W3C、WhatWG 或浏览器供应商分别对有问题的网络技术做出任何结构性改变的幻想的称呼。
史蒂文提到将 10 年前的网络技术状况与现在的网络技术状况进行比较。的确,没有什么惊天动地的变化。但是,在过去的 10 年中,有多少像史蒂夫·维滕斯这样的人?我不知道,但肯定有很多。(而且,还会不断涌现。)
他们取得了什么成就?什么都没有。
你真的对你能或其他人能够对这种情况做出结构性改变抱有幻想吗?
当然,总是有那么一点机会,世界会读到关于你、史蒂夫或任何其他做出这些结构性改变的聪明人的报道。
但在你这样做的时候,这一切仍然是幻想。一种天体的带宽浪费。
而且不要指望在公开写作中告诉他们他们做错了之后,公司/个人会给你多少合作。
这就像写一封公开信并将其发表。有些人会同意。有些人会不同意。有些人会保持中立。但是,所有人都会很快忘记。
也许是因为总有新的项目在望。
我认为,这就是我们推动自己(和网络)前进的方式。讨论和分析问题,寻找新的解决方案。
我们有一些缺点需要处理,但我对人们能够创造出什么感到惊讶。
约束往往是灵感的来源,但这并不意味着我们所能做的就是接受现状!
我真的不明白你为什么能“讨厌”或“强烈不喜欢”任何一种语言。在我看来,HTML、CSS 和浏览器一直在进步。我喜欢创造,而 HTML、CSS、JavaScript 等语言让我能够做到这一点。当然,每种语言都有其局限性和怪癖,但它们并不一定就是限制。一个好的画家不会因为只有一块 8x10 的画布和一把毛刷缺失刷毛就生气或抱怨,他会用手中的工具创造出美丽的艺术品。