PageSpeed для локальных ресурсов, используя ngrok

http://www.jamescryer.com/2014/06/12/grunt-pagespeed-and-ngrok-locally-testing/ https://ngrok.com/

Свойство will-change

Это свойство позволяет сказать браузеру, что сейчас будут изменяться некоторые свойства некоторых элементов, чтобы тот задействовал аппаратное ускорение. http://dev.opera.com/articles/css-will-change-property/

Сервис для генерации спрайтов

Не очень управляемый, но есть возможность сделать сжатие и преобразование в png8. http://zerosprites.com/

Как сделать свой chrome extension

manifest.json должен выглядеть примерно так:

{
  "manifest_version": 2,

  "name": "Jira print extension",
  "description": "This extension is to print tasks in Jira",
  "version": "1.0",
  "background": {
    "scripts": ["background.js"]
  },
  "permissions": [
    "tabs", "https://*/*", "http://*/*"
  ],
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  },
  "content_scripts": [
      {
          "matches": ["http://*/*", "https://*/*"],
          "js": ["libs/jquery.js", "content.js"]
      }
  ]
}

{

"manifest_version": 2,

"name": "Jira print extension",

"description": "This extension is to print tasks in Jira",

"version": "1.0",

"background": {

"scripts": ["background.js"]

"permissions": [

"tabs", "https://*/*", "http://*/*"

"browser_action": {

"default_icon": "icon.png",

"default_popup": "popup.html"

"content_scripts": [

{

"matches": ["http://*/*", "https://*/*"],

"js": ["libs/jquery.js", "content.js"]

}

]

}

При этом: background.js крутится всегда и один для всего браузера, умеет только слать сообщения на разные слои и слушать их. content.js (всё, что указано в content_scripts) имеет доступ к DOM и может слушать сообщения от background.js. popup.html открывается при нажатии на кнопку расширения в панельке, обычный html, должен содержать …

Анимация в css

С картинками и примерами. Understanding CSS Timing Functions http://www.smashingmagazine.com/2014/04/15/understanding-css-timing-functions/

Shutter — аналог tinygrab для Ubuntu

Установка В центре приложений найти shutter и поставить :) Настройка Параметры системы клавиатура комбинации клавиш дополнительные комбинации Добавить

название shutter
команда shutter -s

1 2	название shutter команда shutter -s

Затем там же (в «дополнительных комбинациях») нажать на правую часть строки, в которой написано shutter, и нажать кнопку PrtScr. Ссылки: http://shutter-project.org/faq-help/set-shutter-as-the-default-screenshot-tool/ http://shutter-project.org/wp-content/custom_html_files/shutter_090.pod.html#capture_mode_options

AngularJS: сервис компиляции (интерполяции) шаблонов

Нужно было сделать объектов через шаблоны и отдавать дальше, не в AngularJS. Сделал для этого службу

Gulp не работает — что делать

Вообще-то это актуально для всех паакетов, установленных через npm install. У меня при установке на Ubuntu 14.04 через

sudo npm install -g gulp
npm install --save-dev gulp

1 2	sudo npm install -g gulp npm install --save-dev gulp

не работало ничего, связанное с gulp. Не вызывался даже

gulp --version

1	gulp --version

И самое неприятное, что при запуске любой команды, связанной с gulp, не пишется в консоль ничего, при этом неважно, что и как написать в файлах gulp.js, …

Лоадер страницы на javascript

http://github.hubspot.com/pace/

Как рисовать треугольники на чистом css

Для треугольника, «смотрящего наверх»:

p {
	width: 0;
	height: 0;
	text-indent: -9999px;
	border-right: 80px solid transparent;
	border-bottom: 80px solid #f09;
	border-left: 80px solid transparent;
}

p {

width: 0;

height: 0;

text-indent: -9999px;

border-right: 80px solid transparent;

border-bottom: 80px solid #f09;

border-left: 80px solid transparent;

}

JS Bin http://blog.michelledinan.com/08/2012/drawing-triangles-with-css/ Вот тут много разных использований border-ов — https://blog.bullgare.com/2015/06/%D1%84%D0%B8%D0%B3%D1%83%D1%80%D1%8B-%D0%BD%D0%B0-css-borders/