Daily Reflections (2019/12/24)

Topic Overview

  • DIV with the advantages and disadvantages of two kinds of page layout of the Table
  • Principles, advantages and disadvantages of CSS sprites
  • typeof ( 'abc') and typeof 'abc' is a string, then the operator is also a function typeof
  • Understanding and distinction of the GIT and SVN

Subject to answer

DIV with the advantages and disadvantages of two kinds of page layout of the Table

  • TABLE way
    • advantage
      • Easy to use: more suitable for entry-level user operation, the user can directly use Dreamweaver (hereinafter abbreviated as "DW") toolbar to insert a table, set the length and width, alignment, and other properties.
      • WYSIWYG: When you insert a TABLE when you can see the effect immediately.
      • Good readability: the preparation of the statement is simple, the main code is <TABLE></TABLE>, <TR></TR>, <TD></TD>and other statements.
      • Developing faster: When creating a new Web site, directly from the DW drag TABLE DIV To quickly than writing a lot.
      • Compatibility strong: TABLE design long-standing, widely supported browser, so showing good results, the situation does not appear misplaced
    • Shortcoming
      • Code redundancy, <TABLE><TR>``<TD><TD>``</TR>``< /TABLE>which constitutes a form of basic elements (this is the form of a line), relatively <DIV></DIV>writing, the code range.
      • Web page opens slow: too much code-behind, causing the site to slow to open.
  • DIV + CSS way
    • advantage
      • Standardized page structure: DIV + CSS is the industry standard, is the WEB trends.
      • Code is simple: <DIV></DIV>the more TABLE For many streamlined code.
      • Page browsing faster: the same page for visual effects, using CSS + DIV page capacity than the reconstructed TABLE encoded page file size is much smaller, the former generally only 1/2 the size of the latter.
      • Flexible Page Layout: DIV + CSS page layout makes convenient and flexible to operate, just change the CSS style can be achieved when the revised page layout again, without changes to the program, thereby reducing the cost of the website version. Page effect is rich, including visual effects and user experience, such as drag
    • Disadvantages:
      • Observability difference: When users edit and can not see the edit effect immediately, you need to in order to see the preview.
      • The operation is complicated: with respect to the entry-level user, or the code is not very understanding of people, the operation is very troublesome.
      • Poor compatibility: DIV + CSS design site properly displayed in IE inside the Firefox browser (FireFox) may have changed dramatically, it is required to design different browser style into account.
  • Summary: In fact, what kind of page layout using layout can be, if it is new to the early entry, you need to start from the TABLE, html language to be contacted again when DIV + CSS understanding; or some customers emphasized that the development of the production site speed that html language typesetting can; if html language has been very understanding, or the need for SEO optimization, keyword want to promote, it is best to use DIV + CSS to achieve, so the website traffic and page browsing speed will be faster

Principles, advantages and disadvantages of CSS sprites

  • Definitions: CSS Sprites in domestic many people called css wizard, it is a web application picture approach. It allows a page related to sporadic pictures are all included a large figure, with CSS "background-image", "background- repeat", "background-position" a combination of background position, to avoid the picture to access the page slow loading phenomenon.
  • advantage
    • CSS Sprites can well reduce http requests a web page, thus greatly improving the performance of the page, this is the biggest advantage of CSS Sprites, which is also the main reason for the wide dissemination and application;
    • CSS Sprites can reduce the byte picture;
    • CSS Sprites web designers solved the problem in the picture naming, just a collection of pictures named, does not need to be named for each small picture, thereby improving the web production efficiency.
    • CSS Sprites only need to modify the color or style of a less pictures to change the style of the entire page.
  • Shortcoming
    • Picture Merge trouble: when the picture merge multiple images need to be orderly and reasonable combined into one picture, and leave well enough space to prevent unnecessary background section.
    • Picture poor adaptability: adaptive page at high-resolution screen, if the picture is not wide enough background will appear broken.
    • Image Location cumbersome: calculating the exact position of each background element to be measured by the development tools.
    • Maintainability: page background needed a little change, you may want to modify some or the entire merged picture, and then want to change css. Under the premise of avoiding changes the picture, but only (best) down additional pictures, but it increases the picture bytes.

typeof ( 'abc') and typeof 'abc' is a string, then the operator is also a function typeof

  • typeof is an operator. You can easily check it uses, if it is a function of the type, this expression will return 'function' string, but will result in a syntax error

    typeof(typeof)
    1 Uncaught SyntaxError: Unexpected token ')'
  • So, typeof can not be a function. Possible brackets - symbol typeof (foo) makes you think that is a function typeof, but syntactically, these brackets are not function calls - they are used to group, like (23) * 2. In fact, you can add any number you want:

    typeof(((((foo))))); // is equal to typeof foo;
    "undefined"

GIT and SVN for understanding and distinction,

  • Git is a distributed, SVN is centralized: This is the biggest difference between Git and SVN. If we can grasp this concept, get to know the most basic difference between the two. Because Git is distributed, so Git support offline work, many operations can be performed locally, including branch function. The SVN must be networked to work

  • Git and more complex concepts, SVN is simple difficulty of use: all control of both Git and SVN developers must admit, Git commands too much, need to know their daily work add, commit, status, fetch, push, rebaseand so on, to master, you must also master rebaseand mergedistinction of fetchand pulldifference, etc., in addition, there are cherry-pick, submodule, stashand other functions, just listening to these terms are around.

    In this regard the ease of use, SVN will be much better, simple approachable, very friendly for the novice. But on the other hand see, Git command multi-multi-function means that, if we can grasp the most Git features, appreciate the wonders of which will never go back to find the SVN era

  • Git cheap branches, SVN branch expensive: in the version management, the branch is very often used functions. Before the release version, you need to publish branch, large development needs, need feature branch, there will be a large team development branch, stable branch and so on. In large team development process, there is often create a branch, and branch switching needs. Git branch is a pointer to a commit, the SVN branches are copied directory. This feature allows switching Git branch very quickly, and create very low cost. And there is a local branch of Git, SVN no local branch. In the actual development process, often encounter some of the code did not finish, but the urgent need to deal with other issues, if we use Git, you can create code that is stored local branch did not finish until the problem has been dealt with, and then back to the local branch continue to complete the code

  • The core is a concept Git workflow, workspace (Workspace) is a computer in the actual directory. Staging area (Index) similar to the cache area, temporarily save your changes. Warehouse District (Repository), divided into local and remote warehouse warehouse.

  • Git-SVN commonly used commands:

    • If the server uses SVN, Git but want to experience the local branch of local, offline operation and other functions, you can use the Git-SVNfunction.

      # 下载一个 SVN 项目和它的整个代码历史,并初始化为 Git 代码库
      $ git svn clone -s [repository]
      
      # 查看当前版本库情况
      $ git svn info
      
      # 取回远程仓库所有分支的变化
      $ git svn fetch
      
      # 取回远程仓库当前分支的变化,并与本地分支变基合并
      $ git svn rebase 
      
      # 上传当前分支的本地仓库到远程仓库
      $ git svn dcommit
      
      # 拉取新分支,并提交到远程仓库
      $ svn copy [remote_branch] [new_remote_branch] -m [message]
      
      # 创建远程分支对应的本地分支
      $ git checkout -b [local_branch] [remote_branch]
    • initialization:

      # 在当前目录新建一个Git代码库
      $ git init
      
      # 下载一个项目和它的整个代码历史 [Git only]
      $ git clone [url]
    • Configuration

      # 列举所有配置
      $ git config -l
      
      # 为命令配置别名
      $ git config --global alias.co checkout
      $ git config --global alias.ci commit
      $ git config --global alias.st status
      $ git config --global alias.br branch
      
      # 设置提交代码时的用户信息
      $ git config [--global] user.name "[name]"
      $ git config [--global] user.email "[email address]"
    • Add or remove files:

      # 添加当前目录的所有文件到暂存区
      $ git add .
      
      # 添加指定文件到暂存区
      $ git add <file1> <file2> ...
      
      # 添加指定目录到暂存区,包括其子目录
      $ git add <dir>
      
      # 删除工作区文件,并且将这次删除放入暂存区
      $ git rm [file1] [file2] ...
      
      # 停止追踪指定文件,但该文件会保留在工作区
      $ git rm --cached [file]
      
      # 改名文件,并且将这个改名放入暂存区
      $ git mv [file-original] [file-renamed]
    • Branch

      # 列出所有本地分支
      $ git branch
      
      # 列出所有本地分支和远程分支
      $ git branch -a
      
      # 新建一个分支,但依然停留在当前分支
      $ git branch [branch-name]
      
      # 新建一个分支,并切换到该分支
      $ git checkout -b [new_branch] [remote-branch]
      
      # 切换到指定分支,并更新工作区
      $ git checkout [branch-name]
      
      # 合并指定分支到当前分支
      $ git merge [branch]
      
      # 选择一个 commit,合并进当前分支
      $ git cherry-pick [commit]
      
      # 删除本地分支,-D 参数强制删除分支
      $ git branch -d [branch-name]
      
      # 删除远程分支
      $ git push [remote] :[remote-branch]
    • submit

      # 提交暂存区到仓库区
      $ git commit -m [message]
      
      # 提交工作区与暂存区的变化直接到仓库区
      $ git commit -a
      
      # 提交时显示所有 diff 信息
      $ git commit -v
      
      # 提交暂存区修改到仓库区,合并到上次修改,并修改上次的提交信息
      $ git commit --amend -m [message]
      
      # 上传本地指定分支到远程仓库
      $ git push [remote] [remote-branch]
    • Pull

      # 下载远程仓库的所有变动 (Git only)
      $ git fetch [remote]
      
      # 显示所有远程仓库 (Git only)
      $ git remote -v
      
      # 显示某个远程仓库的信息 (Git only)
      $ git remote show [remote]
      
      # 增加一个新的远程仓库,并命名 (Git only)
      $ git remote add [remote-name] [url]
      
      # 取回远程仓库的变化,并与本地分支合并,(Git only), 若使用 Git-SVN,请查看第三节
      $ git pull [remote] [branch]
      
      # 取回远程仓库的变化,并与本地分支变基合并,(Git only), 若使用 Git-SVN,请查看第三节
      $ git pull --rebase [remote] [branch]
    • Undo

      # 恢复暂存区的指定文件到工作区
      $ git checkout [file]
      
      # 恢复暂存区当前目录的所有文件到工作区
      $ git checkout .
      
      # 恢复工作区到指定 commit
      $ git checkout [commit]
      
      # 重置暂存区的指定文件,与上一次 commit 保持一致,但工作区不变
      $ git reset [file]
      
      # 重置暂存区与工作区,与上一次 commit 保持一致
      $ git reset --hard
      
      # 重置当前分支的指针为指定 commit,同时重置暂存区,但工作区不变
      $ git reset [commit]
      
      # 重置当前分支的HEAD为指定 commit,同时重置暂存区和工作区,与指定 commit 一致
      $ git reset --hard [commit]
      
      # 新建一个 commit,用于撤销指定 commit
      $ git revert [commit]
      
      # 将未提交的变化放在储藏区
      $ git stash
      
      # 将储藏区的内容恢复到当前工作区
      $ git stash pop
    • Inquire

      # 查看工作区文件修改状态
      $ git status               
      
      # 查看工作区文件修改具体内容   
      $ git diff [file]
      
      # 查看暂存区文件修改内容
      $ git diff --cached [file] 
      
      # 查看版本库修改记录
      $ git log                  
      
      # 查看某人提交记录
      $ git log --author=someone 
      
      # 查看某个文件的历史具体修改内容
      $ git log -p [file]        
      
      # 查看某次提交具体修改内容
      $ git show [commit]

Guess you like

Origin www.cnblogs.com/EricZLin/p/12094013.html